React native 如何在react native中动态设置initialRouteName

如何在react导航中提供动态初始路由名称？如果装置存在，我们必须重定向到另一条路线，否则我们必须采用另一条路线

---

注意：我正在创建一个底部选项卡导航器，我必须在其中设置到该特定底部选项卡导航器的初始路径

（不是身份验证流）

---

您可以在主页或App.js上查看条件

render() {
  const status = get AsyncStorage.getItem('unit');
  if(status != null)
  { return <Home/> }
  else
  { return <AnotherScreen/> }
}

render（）{
const status=get AsyncStorage.getItem（'unit'）；
如果（状态！=null）
{return}
其他的
{return}
}

但是如果使用stacknavigator或switchnavigator，我们可以在页面之间切换。。

---

据我所知，我们无法直接进入特定选项卡。（如果我错了，请纠正我）。

根据文档，请参见，

initialRoute

名称不应是

async func

所以理想情况下，你应该做的是，无论如何，你的应用程序需要一个splashscreen，在那里你可以显示应用程序的徽标和名称。将该页面设为initialRoute，并在其componentDidMount中检查异步函数并导航到所需页面

就像我所做的：

createSwitchNavigator(
    {
      App: TabNavigator,
      Auth: AuthStack,
      SplashScreen: SplashScreen,
    },
    {
      initialRouteName: 'SplashScreen',
    },
  ),

在屏幕内部，我正在做：

componentDidMount(){
 if (token) {
      this.props.navigation.navigate('App');
    } else {
      this.props.navigation.navigate('Auth');
    }

}

希望它是清楚的。如您所见，请放心怀疑

：

如果需要将initialRouteName设置为道具，那是因为 是在渲染之前需要异步获取的一些数据 应用程序导航。另一种处理方法是使用 切换导航器，并在抓取时显示屏幕 异步数据，然后使用 在必要时使用参数。请参阅文档以了解这方面的完整示例

看一看

你会找到更多的描述

此外，这种情况的快速修复方法是在SplashScreencomponentDidMount（）函数中检查您的状况

SplashScreen示例：

componentDidMount(){
  AsyncStorage.getItem('unit')
    .then(unit => {
      if(unit){
       this.props.navigation.navigate('Home')
      }else{
       this.props.navigation.navigate('secondTab')
      }
    })
    .catch(err => {

    });
}

---

好的，在导航页面中创建状态并相应地更改其值，如

render() {
  const status = get AsyncStorage.getItem('unit');
  if(status != null)
  { setState({ name : 'Home'}) }
  else
  { setState({ name : 'anotherTab'}) }
} 

然后将该状态传递给tabNavigation

initialRouteName: this.state.name,

---

这种状态下，setState函数是基于分类的，因此您必须使用useState来代替页面上的初始状态

我正在创建一个底部选项卡导航器，其中我必须设置初始路由。我正在创建一个底部选项卡导航器，其中我必须设置初始路由，而不是SwitchNavigator。对不起，我没有理解您的意思。应用程序渲染后（am不在根级别）创建底部选项卡导航。

initialRouteName: this.state.name,