使用React本机导航重新启动应用时出现间歇性黑屏

时间:2018-07-24 20:55:58

标签: reactjs react-native wix-react-native-navigation

我正在使用React native navigation V:"^1.1.334"处理我的应用程序中的路由。我目前正在首先呈现一个登录屏幕,然后使用redux / redux-saga调度一个操作,以根据用户是否登录来更改状态。我在发行版本中遇到问题,一段时间后,如果我重置该应用程序,它将仅呈现空白屏幕,并且屏幕上没有任何内容,并且是修复该问题的唯一方法,它可以完全擦除该应用程序的数据和缓存。强制停止应用程序无效。我想象有很多可能的原因,但是我高度怀疑这可能与我实现登录屏幕逻辑以切换到受保护内容的方式有关。我有一个非常标准的index.js

var store = configureStore();

registerScreens(store, Provider); // this is where you register all of your app's screens

// start the app
Navigation.startSingleScreenApp({
    screen: {
        screen: 'myapp.Login',
        navigatorStyle,
    },
    drawer: { // optional, add this if you want a side menu drawer in your app
        left: { // optional, define if you want a drawer from the left
            screen: 'myapp.Drawer', // unique ID registered with Navigation.registerScreen
            fixedWidth: 600, // a fixed width you want your left drawer to have (optional)
        }
    }
});
AppRegistry.registerHeadlessTask('TrackPlayer', 
    () => require('./app/modules/player/player-handler.js')(store));

然后在我的登录屏幕中,我具有身份验证逻辑

componentDidMount(){
  this.props.actions.checkAuth();
}

render() {
  if (this.props.user.isAuth) {
    this.props.navigator.resetTo({
      screen: 'myApp.Player',
      navigatorStyle :{
        navBarHidden: true,
      }
    });

    return null;
  }

  return (<LoginScreen />);
}

checkAuth函数调度一个异步操作,然后,如果用户通过了身份验证,则状态将通过redux进行更改,并且user.isAuth被更新,这将重置应用程序。我认为问题是我可能无法重置 主屏幕仍在渲染时显示应用程序?因为它可能会触发某种竞速条件并且什么都不会渲染?

所以我的问题是,将此逻辑放置在render方法中是否会发生冲突,如果存在冲突,则应在哪里实现该逻辑?还是这可能是react-native-navigation的问题?

我已经检查了log-android的输出(因为它是一个发布版本),并且在应用正确呈现时以及在不正确呈现时,输出看起来是相同的,至少没有明确抛出任何错误。

如果您好奇的话,这里是什么样子。也可能是我也以singleTask的身份启动了我的应用程序吗?还要其他吗?我进行了更改,因为按下后退按钮时应用程序从后台返回时一直遇到问题,但这无法解决。不过,这是另一个问题。

07-24 15:35:19.703  4150  4150 D ReactNative: ReactInstanceManager.ctor()
07-24 15:35:19.715  4150  4150 D ReactNative: ReactInstanceManager.createReactContextInBackground()
07-24 15:35:19.715  4150  4150 D ReactNative: ReactInstanceManager.recreateReactContextInBackgroundInner()
07-24 15:35:19.720  4150  4150 D ReactNative: ReactInstanceManager.recreateReactContextInBackgroundFromBundleLoader()
07-24 15:35:19.720  4150  4150 D ReactNative: ReactInstanceManager.recreateReactContextInBackground()
07-24 15:35:19.720  4150  4150 D ReactNative: ReactInstanceManager.runCreateReactContextOnNewThread()
07-24 15:35:19.811  4150  4169 D ReactNative: ReactInstanceManager.createReactContext()
07-24 15:35:20.158  4150  4169 D ReactNative: Initializing React Xplat Bridge.
07-24 15:35:20.163  4150  4169 D ReactNative: Initializing React Xplat Bridge before initializeBridge
07-24 15:35:20.172  4150  4169 D ReactNative: Initializing React Xplat Bridge after initializeBridge
07-24 15:35:20.173  4150  4169 D ReactNative: CatalystInstanceImpl.runJSBundle()
07-24 15:35:20.199  4150  4178 D ReactNative: ReactInstanceManager.setupReactContext()
07-24 15:35:20.200  4150  4178 D ReactNative: CatalystInstanceImpl.initialize()
07-24 15:35:21.547  4150  4150 D ReactNative: ReactInstanceManager.attachRootViewToInstance()
07-24 15:35:21.559  4150  4177 I ReactNativeJS: Running application "uplayer.Drawer" with appParams: {"initialProps":{"screenInstanceID":"screenInstanceID4","navigatorID":"navigatorID3_nav","navigatorEventID":"screenInstanceID4_events"},"rootTag":1}. __DEV__ === false, development-level warning are OFF, performance optimizations are ON
07-24 15:35:21.593  4150  4150 D ReactNative: ReactInstanceManager.attachRootViewToInstance()
07-24 15:35:21.729  4150  4177 I ReactNativeJS: Running application "uplayer.Login" with appParams: {"initialProps":{"screenInstanceID":"screenInstanceID2","navigatorID":"navigatorID1_nav","navigatorEventID":"screenInstanceID2_events"},"rootTag":11}. __DEV__ === false, development-level warning are OFF, performance optimizations are ON
07-24 15:35:22.330  4150  4177 I ReactNativeJS: Cookie doesn't contain sid [object Object]
07-24 15:35:24.216  4150  4177 I ReactNativeJS: isPurchased false

0 个答案:

没有答案