使用 PersistGate 的启动画面

Question

我有以下代码库

Navigator.js 导出默认 createAppContainer(createSwitchNavigator( { // 屏幕设计：屏幕设计，启动画面：启动画面，应用程序：drNav，授权栈：授权栈 }, { 初始路由名称：'SplashScreen'， } ));

import SplashScreen from './screens/SplashScreen'
<Provider store={store}>
<PersistGate loading={<SplashScreen/>} persistor={persistor}>
<View style={styles.container}>
<Navigator />
</View>
</PersistGate>
</Provider>

splashScreen.js

componentDidMount() {
    if (this.state.isAuthenticated) {
      this.props.navigation.navigate("App");
    }
    else {
      this.props.navigation.navigate("AuthStack");
    }
  }

我低于错误

Before implementing redux, I have used this page as entry screen for my app, showing as splash screen and behind checking if user is authenticated or not, if it is authenticated redirecting to login page else dashboard. It was working fine, but now I have used redux, then the scenario is working similarly only diff this screen is not visible since redux persis load data from storage

请帮助我是 React Native 的新手，无法理解这个错误

谢谢

Answer 1

您的代码似乎无法在 SplashScreen 组件.

中找到 navigation

1) 尝试在 SplashScreen 组件的 render 方法中控制它。 2) 同时检查 redux 配置，可能是你的 redux 配置有问题，因为你的组件无法访问导航道具。

Answer 2

导航道具可用于在导航器内部定义的所有组件。 SplashScreen 组件不是 Navigator 的一部分，因此它无权访问导航道具。但我认为你在那里不需要它。

您的 SplashScreen 组件是一个转储组件，只要 PersistGate 需要将存储的数据加载到您的 redux 存储中，它就会显示给用户。因此，当数据加载完成后，您将看到在 PersistGate 中定义的其余组件。所以我不明白你为什么需要使用这个加载组件的导航。

如果您确实需要从 SplashScreen 访问导航道具，您可以按照以下指南操作：https://reactnavigation.org/docs/en/connecting-navigation-prop.html

使用 PersistGate 的启动画面

Splash screen with PersistGate

react-native

redux

redux-persist