Question

我正在使用react-navigation并在TabNavigator内嵌套StackNavigator。我在TabNavigator中有三个标签，需要根据某些逻辑动态设置initialRouteName TabNavigator。

我尝试将TabNavigator放入React组件中，并使用动态选择的初始标签，并在StackNavigator中使用screenProps TabNavigator {}} {}但是这样我就无法导航到StackNavigator的任何路线。

有没有办法动态制作initialRouteName。

注意：我没有在此应用程序中使用redux。

Answer 1

<Tab.Navigator
 initialRouteName="YOUR_TAB_NAME"
 ... 
/>

...

参考：https://reactnavigation.org/docs/bottom-tab-navigator/#initialroutename

Answer 2

看来你真的很近。
您可以设置导航状态的索引，以指定将其显示为初始路线。

<SomeTabNavigator
  navigation={{
    ...this.props.navigation,
    state: {
      ...this.props.navigation.state,
      index: 1 // or whichever you want
    }
  }}
  screenProps={{
    // whatever the props you wanna pass to child screens.
  }}
/>

但是您还必须通过静态路由才能通过路由器，否则无法导航。（或尝试使用navigate而非push进行导航）。

class Screen extends React.Component{

  static router = SomeTabNavigator.router

...

如果不是这种情况，则应检查导航器的结构，以确保您正确堆叠了堆栈导航器和选项卡导航器。

也许为时已晚，但我希望它能对某人有所帮助。

查看下面的链接以获取更多详细信息。

https://reactnavigation.org/docs/en/custom-navigators.html

如何动态设置反应导航TabNavigator中的初始选项卡

2 个答案: