Question

我的主页包含一个视图。此视图包含带有项目的平面列表。平面列表通过不同的组件呈现

我应该可以使用 this.props.navigation.navigate（＆＃39; DetailPage＆＃39;）之类的内容，而不是来自我的主页。

我认为我应该将导航作为支柱传递给但不确定我该怎么做。

导航文件

export const HomePageStack = StackNavigator({
      Homepage:{
          screen:homePage,
      },
      DetailPage:{
          screen: DetailPage,
      }

})

主页屏幕

render(){
   return(
       <View>
           <DetailedArea />
       </View>
)}

详细区域

render(){
   return(
      <TouchableHighlight onPress={this.props.navigation.navigate('DetailPage')}>
         <Text>CLICK HERE TO GO TO DETAIL PAGE</TEXT>
      </TouchableHighlight>
)}

Answer 1

HomeScreen有this.props.navigation，但不会传递给DetailedArea。

我建议如下：

<强>主屏幕

render(){
   return(
       <View>
           <DetailedArea onNavigate={() =>  this.props.navigation.navigate('DetalPage')} />
       </View>
)}

<强> DetailedArea

render(){
   return(
      <TouchableHighlight onPress={this.props.onNavigate}>
         <Text>CLICK HERE TO GO TO DETAIL PAGE</TEXT>
      </TouchableHighlight>
)}

React-native-navigation导航通过不同的组件而不是页面

1 个答案: