使用嵌套导航时黑屏

Question

我是新来的响应本机的人。我正在制作一个具有嵌套导航的应用程序。它具有一个stackNavigator- tabNavigator和抽屉导航器。 问题是我使用stackNavigator来显示LoginScreen，并且当用户登录到他/她的帐户并且试图将用户导航到主屏幕时，它显示空白的白屏。如果我返回并再次登录，效果很好。

这是我的导航代码

render() {
 if (this.state.appIsReady) {
   const MainTab = createStackNavigator({
     auth: {
          screen: AuthScreen,
          navigationOptions: { //عدم نمایش استک نویگیشن در صفحه لوگین وثبت نام
                 header: null,
          }
      },
      registration: {
       screen: Registration,
       navigationOptions: { //عدم نمایش استک نویگیشن در صفحه لوگین وثبت نام
             header: null,
       }
     },

    //Make Drawer
     DrawerNavigator: {
       screen: createDrawerNavigator({
           Home: {
             screen: createMaterialTopTabNavigator({
                   prices: { screen: Prices },
                   priceLower: { screen: PriceLower },
                   priceHigher: { screen: PriceHigher },
               }, {
                 swipeEnabled:false,
                animationEnabled:false,
                 // lazy: true,
                 // lazyLoading: true //Don't auto render screens
               }) }
       }, {

           contentComponent: DrawerScreen,
           drawerWidth: 300,
           swipeEnabled:false,
            animationEnabled:false,
       })
     }

   }, {
     navigationOptions: ({ navigation }) => ({
         title: 'ReactNavigation',  // Title to appear in status bar
         headerLeft:
          <TouchableOpacity onPress={() => {     navigation.dispatch(DrawerActions.toggleDrawer()) }}>
             <MenuImage style="styles.bar" navigation={navigation} />
         </TouchableOpacity>,
         headerStyle: {
             backgroundColor: '#333',
         },
         headerTintColor: '#fff',
         headerTitleStyle: {
           fontWeight: 'bold',
         },
         swipeEnabled:false,
          animationEnabled:false,
     })
   })


    return (
      <Provider store={store}>
        <SafeAreaView style={styles.container}>
          <MainTab />
        </SafeAreaView>
      </Provider>
    );
   }

  return <AppLoading />;
}

当用户登录时，我在登录屏幕中使用此代码：

componentWillReceiveProps(nextProps) {
  if (nextProps.auth) {
  this.setState({ loading: false })
  if (nextProps.auth.loginFailed === true) {
    this.dropdown.alertWithType('error',
    'خطا'
    , nextProps.auth.errMessage);
  } else {
    console.log(this.props);
    // this.props.navigation.push('DrawerNavigator')

    const navigateToMainScreen = NavigationActions.navigate({
    routeName: 'DrawerNavigator',
    action: NavigationActions.navigate({
      routeName: 'prices'
    })
  });
  this.props.navigation.dispatch(navigateToMainScreen);
  }
  }
}