React Native Navigation:在嵌套在堆栈导航器中的选项卡导航器中组织组件引用的最佳方法?

时间:2020-07-05 00:32:15

标签: react-native react-navigation react-navigation-stack stack-navigator react-native-tabnavigator

在我的React Native应用程序中,我有一个名为StackNavigator的堆栈导航器,其中包含两个标签导航器TabNavigator1TabNavigator2TabNavigator1包含屏幕TabNavigator1_Screen1TabNavigator1_Screen2,而TabNavigator1包含TabNavigator2_Screen1TabNavigator2_Screen2。 从所有这四个屏幕中,用户都需要能够导航到其他各种屏幕,Screen1Screen2Screen3

我正在使用react-navigation@4.x

我想知道的事情:

在哪里放置对Screen1Screen2Screen3的引用的最佳位置?我唯一可以添加的地方是定义StackNavigator时。所以我会做

createStackNavigator(
  {
    TabNavigator1,
    TabNavigator2,
    TabNavigator1_Screen1,
    TabNavigator1_Screen2,
    TabNavigator2_Screen1,
    TabNavigator2_Screen2,
    Screen1,
    Screen2,
    Screen3,
    Screen4,
  }
)

,然后在TabNavigator1TabNavigator1中,通过

将其导航道具传递到屏幕
screenProps={{
  navigation: this.props.navigation
}}

以便TabNavigator1_Screen1可以通过Screen1导航到this.props.screenProps.navigation.navigate('Screen1')

是否可以组织所有这些屏幕引用,以便定义TabNavigator1中的屏幕可以导航到的特定屏幕,以及TabNavigator1中的屏幕可以导航到的其他屏幕?

0 个答案:

没有答案