Question

我正在使用react native和react导航。我正在创建一个反应导航抽屉，然后使用自己的格式在抽屉内部。我正在努力使我的注销按钮正常工作。

这很好：

 <TouchableOpacity onPress={this.props.logoutUser()}>
     <Text style={{margin: 16,fontWeight: 'bold'}}>Logout</Text>
 </TouchableOpacity>

但是我想添加一个警报，并确保用户要注销。这行不通。它会注销用户，下次我登录该应用程序时，我可以看到他们已注销，但是直到我手动刷新该应用程序后，它才会触发刷新。

    <TouchableOpacity onPress={()=>
          Alert.alert(
            'Log out',
            'Do you want to logout?',
            [
              {text: 'Cancel', onPress: () => {return null}},
              {text: 'Confirm', onPress: () => {
                this.props.logoutUser
              }},
            ],
            { cancelable: false }
          )  
        }>
        <Text style={{margin: 16,fontWeight: 'bold'}}>Logout</Text>
    </TouchableOpacity>

作为参考，这是我根据用户是否登录来呈现登录屏幕与主页（props.restoring）更改的方式。由于某种原因，它只会随着top调用而更新，我想知道抽屉或警报是否会影响我如何调用函数：

const ChatAppComponent = props => {
  if (props.restoring) {
    return <ActivityIndicator style={styles.activityIndicator} />
  } else {
    if (props.logged) {
      return <DashboardNavigator />
    } else {
      return <AuthScreen />
    }
  }
}

编辑：添加注销功能

export const logoutUser = () => {
  return dispatch => {
    dispatch(sessionLoading());

    LoginManager.logOut();
    firebaseService
      .auth()
      .signOut()
      .then(async () => {
        await GoogleSignin.revokeAccess();
        await GoogleSignin.signOut();
        dispatch(sessionLogout());
      })
      .catch(error => {
        dispatch(sessionError(error.message));
      });
  };
};

Answer 1

您需要使用redux调用此函数。

<TouchableOpacity onPress={()=>
   Alert.alert(
        'Log out',
        'Do you want to logout?',
        [
          {text: 'Cancel', onPress: () => {return null}},
          {text: 'Confirm', onPress: () => {
            this.props.dispatch(this.props.logoutUser()); //here
          }},
        ],
        { cancelable: false }
      )  
    }>
    <Text style={{margin: 16,fontWeight: 'bold'}}>Logout</Text>
</TouchableOpacity>

注销功能是一种还原操作。

Answer 2

答案与异步等待有关。不知道为什么它不能与异步等待一起使用，但是我不得不将调度动作移到Google方法上方。

firebaseService
          .auth()
          .signOut()
          .then(async () => {
            dispatch(sessionLogout());
            await GoogleSignin.revokeAccess();
            await GoogleSignin.signOut();
          })

反应导航抽屉OnPress无法正确触发

2 个答案: