Question

this navigation library遇到一些问题。
我看到所有组件都是独立的，但我需要在所有屏幕上都有HOC。
例如，如果我没有连接，我想只显示一个屏幕，如果连接可用 - 显示当前基于选项卡的应用程序

我如何做到这一点？

感谢您的任何想法。

注册组件代码

const registerScreens = (appType, store) => {
  switch (appType) {
    case appTypes.ROOT_APP: {
      Navigation.registerComponent(screens.APP, () => App, store, ApolloProvider, { client });
      break;
    }
    case appTypes.SINGLE_BASED_APP:
      Navigation.registerComponent(screens.ONBOARDING, () => OnboardingContainer, store, ApolloProvider, { client });
      break;
    case appTypes.TAB_BASED_APP:
      // App Screens
      Navigation.registerComponent(screens.DISCOVER, () => DiscoverContainer, store, ApolloProvider, { client });
      break;
    default:
      throw new Error('appType is not defined.');
  }
};

Answer 1

您需要React native中的NetInfo API来检查连接状态。并使用react-react-navigation导航移动到正确的屏幕 - 单屏幕应用程序或基于选项卡的应用程序。

NetInfo.getConnectionInfo().then((connectionInfo) => {
  if (connectionInfo.type === 'none') {
    Navigation.startSingleScreenApp(params);
  } else {
    Navigation.startTabBasedApp(params);
  }
});

反应本机wix / react-native-navigation

1 个答案: