![](/img/trans.png)
[英]Unable to render navigation screen using react native navigation, stack navigator
[英]React Native: New screen after touching image using stack navigator
我正在嘗試通過創建應用程序來學習React Native
。 觸摸圖像后,我希望將新屏幕放在當前屏幕的頂部。
我想我想在onPress
之后使用StackNavigator
嗎? 我已經閱讀過它們,但不知道如何在我當前的代碼中使用它們。 有任何想法嗎??
const listView = ({name, picture}) => {
return (
<View style = {styles.item}>
<TouchableWithoutFeedback onPress={() => //new screen here!!}>
<ImageBackground source = {picture}
resizeMode = 'cover'
style={styles.image}>
<Text style={styles.text}>{name}</Text>
</ImageBackground>
</TouchableWithoutFeedback>
</View>
)
};
請在評論中留下您需要的任何問題。
您可以使用Createrestacknavigator.
exampleApp.js:
import React, { Component } from "react";
import {
createStackNavigator,
createAppContainer,
} from "react-navigation";
import Home from "./Home.js"
import Second from "./Second.js"
...
const RootStack = createStackNavigator(
{
Home: {
screen: Home
},
Second: {
screen: Second
}
},
{
initialRouteName: "Home",
headerMode: "none"
}
);
const AppContainer = createAppContainer(RootStack);
export default AppContainer;
exampleHome.js:
return (
<View style = {styles.item}>
<TouchableOpacity onPress={() => this.props.navigation.navigate("Second")}>
<ImageBackground source = {picture}
resizeMode = 'cover'
style={styles.image}>
<Text style={styles.text}>{name}</Text>
</ImageBackground>
</TouchableOpacity >
</View>
)
有關功能的更多信息,請參閱此鏈接 。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.