世博会应对本机注销功能不正常工作

Question

我正在开发一个世博会反应本地应用程序。在那里，我面临一个退出的问题。注销龙头位于用户的配置文件部分内。根据当前的代码，当我第一次登录到应用程序时，它会重定向到主导航(默认菜单)。如果我在注销后登录到应用程序，它会重定向到profile部分。

• ，我尝试在注销时导航到登录部分。它不起作用。
• 我试过每次登录时重新加载应用程序。它适用于ios，而不是android。但我觉得这样做不是个好办法。--

//Using navigation
logOutPress() {
        var _this =this;
        firebase.auth().signOut().then(function () {
            // Sign-out successful.
            _this.props.navigation.navigate('Login');
            AsyncStorage.clear();
        }
    }

//Reloading
logOutPress() {
        var _this =this;
        firebase.auth().signOut().then(function () {
            // Sign-out successful.

            AsyncStorage.clear();
            Platform.OS == 'ios' ? NativeModules.DevSettings.reload() : '';
        }
    }

 //Create the required screens in StackNavigator
        var theScreen = createStackNavigator({
          Master: { screen: ({ navigation })=>(<MyMastSreen data={item} navigation={navigation} design={design} isRoot={true} />) },
          Categories: { screen: ({ navigation })=>(<MyCategoriesSreen data={item} navigation={navigation} design={design} isRoot={item.category_first} subMenus={[]} />) },
          MasterSUB: { screen: ({ navigation })=>(<MyCategoriesSreen data={{'categorySetup':item}} navigation={navigation} design={design} isRoot={true} subMenus={item.subMenus} />) },
          Details: { screen:({ navigation })=>(<MyDetailsSreen data={item} navigation={navigation} design={design} isRoot={true}/>) },
          DineIn: { screen:({ navigation})=>(<MyDineInScreen data={item} navigation={navigation} design={design} isRoot={true} />) },
          Gallery: { screen:({ navigation })=>(<MyGallerySreen data={item} navigation={navigation} design={design} />) },
          ForgetPassword: {screen: ForgetPassword},
          SignUp: { screen: SignUp }, 
          WebSub: { screen: ({ navigation })=>(<MyWebSreen data={item} navigation={navigation} design={design} isRoot={true} fromNotification={true} />) },
          NotificationsSub: { screen: ({ navigation })=>(<MyNotificationsSreen data={item} navigation={navigation} design={design} isRoot={false} />) },
          OrdersSub: { screen: ({ navigation })=>(<MyOrdersSreen data={item} navigation={navigation} design={design} isRoot={false} />) },
          TicketsSub: { screen: ({ navigation }) => (<MyTicketSreen data={item} userEmail={this.state.userEmail} navigation={navigation} design={design} isRoot={false} />) },
          OrderDetail: { screen: ({ navigation })=>(<MyOrderDetailSreen data={item} navigation={navigation} design={design}/>) },
          DineInOrders: { screen: ({ navigation })=>(<MyDineInOrderScreen data={item} navigation={navigation} design={design} isRoot={true} />) },
          // DineInOrderDetail: { screen: ({ navigation })=>(<MyDineInOrderDetailScreen data={item} navigation={navigation} design={design}/>) },
          ProfileSettingsSub: { screen:({ navigation })=>(<MyProfileSettingsSreen data={item} navigation={navigation} design={design} isRoot={false} />) },
          SubProfile: { screen: ({ navigation })=>(<MyProfileSreen data={item} navigation={navigation} design={design} isRoot={false} />)},
          ProfileSettings: { screen:({ navigation })=>(<MyProfileSettingsSreen data={item} navigation={navigation} design={design} />) },
          ListOfUsersSub: { screen:({ navigation })=>(<MyListOfUsersSreen data={item} navigation={navigation} design={design} />) },
          Chats: { screen:({ navigation })=>(<MyChatsSreen data={item} navigation={navigation} design={design} />) },
          Chat: { screen: ({ navigation })=>(<MyChatSreen data={item} navigation={navigation} design={design} />)},
          Gift: { screen: ({ navigation }) => (<MyGiftSreen data={item} userEmail={this.state.userEmail} navigation={navigation} design={design} />) },


        },{
          //initialRouteName:item.category_first?"Categories":(item.subMenus&&(item.subMenus.length>0?"MasterSUB":"Details")),
          initialRouteName:initialRootName,
          headerMode:"none",
          navigationOptions: {
            headerTintColor: 'blue',
          }
        });
      }

我想要的结果是在注销后登录到应用程序时打开默认导航，而不是配置文件部分。请帮我解决这个问题。

提前谢谢。

Answer 1

尝试如下：

在堆栈中看不到对Login页面的引用，因此将_this.props.navigation.navigate('Login');更改为_this.props.navigation.navigate('SignUp');

--处理身份验证和堆叠导航的更好方法

1. 使用createSwitchNavigator来处理根堆栈，对于您的应用程序，如下所示：

const AppNavigator = createSwitchNavigator(
   {
      Loading: LoadingScreen,   // Include a loading screen that will check authentication state
      Auth: AuthNavigator,
      Main: MainNavigator
   },
   {
      initialRouteName: 'Loading',
      // Other configs
   }
)

1. AuthStack这将拥有您的所有登录名。注册、欢迎等屏幕，如下：

const AuthStack = createStackNavigator(
   {
        SignUp: { screen: SignUp },
        ForgetPassword: {screen: ForgetPassword},
        // Include other screens here if applicable
   },
   {
        initialRouteName: 'SignUp'
        // Other configs
   }
)

1. MainStack it将有您所有的应用程序屏幕，从您在问题上显示的内容来看，它应该是这样的：

const MainStack = createStackNavigator(
    {
          Master: { screen: ({ navigation })=>(<MyMastSreen data={item} navigation={navigation} design={design} isRoot={true} />) },
          Categories: { screen: ({ navigation })=>(<MyCategoriesSreen data={item} navigation={navigation} design={design} isRoot={item.category_first} subMenus={[]} />) },
          MasterSUB: { screen: ({ navigation })=>(<MyCategoriesSreen data={{'categorySetup':item}} navigation={navigation} design={design} isRoot={true} subMenus={item.subMenus} />) },
          Details: { screen:({ navigation })=>(<MyDetailsSreen data={item} navigation={navigation} design={design} isRoot={true}/>) },
          DineIn: { screen:({ navigation})=>(<MyDineInScreen data={item} navigation={navigation} design={design} isRoot={true} />) },
          Gallery: { screen:({ navigation })=>(<MyGallerySreen data={item} navigation={navigation} design={design} />) },
          WebSub: { screen: ({ navigation })=>(<MyWebSreen data={item} navigation={navigation} design={design} isRoot={true} fromNotification={true} />) },
          NotificationsSub: { screen: ({ navigation })=>(<MyNotificationsSreen data={item} navigation={navigation} design={design} isRoot={false} />) },
          OrdersSub: { screen: ({ navigation })=>(<MyOrdersSreen data={item} navigation={navigation} design={design} isRoot={false} />) },
          TicketsSub: { screen: ({ navigation }) => (<MyTicketSreen data={item} userEmail={this.state.userEmail} navigation={navigation} design={design} isRoot={false} />) },
          OrderDetail: { screen: ({ navigation })=>(<MyOrderDetailSreen data={item} navigation={navigation} design={design}/>) },
          DineInOrders: { screen: ({ navigation })=>(<MyDineInOrderScreen data={item} navigation={navigation} design={design} isRoot={true} />) },
          // DineInOrderDetail: { screen: ({ navigation })=>(<MyDineInOrderDetailScreen data={item} navigation={navigation} design={design}/>) },
          ProfileSettingsSub: { screen:({ navigation })=>(<MyProfileSettingsSreen data={item} navigation={navigation} design={design} isRoot={false} />) },
          SubProfile: { screen: ({ navigation })=>(<MyProfileSreen data={item} navigation={navigation} design={design} isRoot={false} />)},
          ProfileSettings: { screen:({ navigation })=>(<MyProfileSettingsSreen data={item} navigation={navigation} design={design} />) },
          ListOfUsersSub: { screen:({ navigation })=>(<MyListOfUsersSreen data={item} navigation={navigation} design={design} />) },
          Chats: { screen:({ navigation })=>(<MyChatsSreen data={item} navigation={navigation} design={design} />) },
          Chat: { screen: ({ navigation })=>(<MyChatSreen data={item} navigation={navigation} design={design} />)},
          Gift: { screen: ({ navigation }) => (<MyGiftSreen data={item} userEmail={this.state.userEmail} navigation={navigation} design={design} />) },
   },
   {
          initialRouteName: 'Master',   // <== Make sure to set this to the first screen you want on your application
          // Other configs
   }
)

1. LoadingScreen The应如下所示：

class LoadingScreen extends React.Component {
    componentDidMount = async () => {
        const userId = await AsyncStorage.getItem('userId')
        this.props.navigation.navigate(userId ? 'Main' : 'Auth')   // This will check if there is any item stored with userId, if true it will navigate to Main else to Auth
    }

    render() {
        return (
            <View
                style={{
                    flex: 1,
                    alignItems: 'center',
                    justifyContent: 'center',
                    backgroundColor: 'white'
                }}>
                <Text style={styles.textloadingStlye}>Loading Screen</Title>
            </View>
        )
    }
}

1. 身份验证流与AsyncStorage，当您第一次登录或注册用户时，确保在成功的身份验证之后并在将它们导航到主屏幕之前添加此内容，如下所示：

.... // Firebase login, then
await AsyncStorage.setItem('userId', id);   // <== Here id is what you want to store of the user data for authentication, could be his db id or name or whatever you have
this.props.navigation.navigate('Loading'); 

1. Your Signout，现在您终于可以登出do:

logOutPress() {
   firebase.auth().signOut();   // <== This will signout from firebase
   AsyncStorage.clear();   // <== This will clear the userId from storage
   this.props.navigation.navigate('Loading');   // <== We navigate to the loading screen we set earlier, which will check if there is a userId and navigate accordingly 
}

注意:请记住，在这个设置中，您的主要堆栈是AppNavigator ，所以请确保转换 export default createAppContainer(AppNavigator)

希望这能帮上忙！