La navigation après dispatchin action redux à réagir natif

0

La question

J'ai tenter de mettre en place l'authentification de réagir application native avec redux, après l'expédition de l'action login.Le code dans l'Écran de Connexion:

const dispatch = useDispatch();
const auth = useSelector(state => state.authentication);

const onSubmit = (data: {email: string; password: string}) => {
  dispatch(loginUser(data));
  auth.isAuth && navigation.navigate('Home');
};
Le code de l'action login est :

export const loginUser = data => async dispatch => {
  try {
    const res = await axios({
      method: 'post',
      url: `${API_URl}/auth/login`,
      data,
    });
    dispatch({type: LOGIN_SUCCESS, payload: res.data});    
  } catch (error) {
    dispatch({type: GET_ERRORS, payload: error.response.data});
    dispatch({type: LOGIN_FAILED, payload: error.response.data});
  }
};
Le code pour le réducteur est ci-dessus:

 case LOGIN_SUCCESS:
 case REGISTER_SUCCESS:
      return {
        ...state,
        user: payload.user,
        isAuth: true,
        message: null,
      };

Je veux accéder à un autre écran 'Home', mais ce n'est pas fait pour la première fois après l'expédition de connexion d'action bien que j'ai vérifié que l'état est modifié : entrez la description de l'image de la console après avoir appuyé sur la bouton de connexion

1

La meilleure réponse

0

Vous êtes d'appel onSubmitqui appelle loginUser. Au loginUser cependant, vous disposez d'un appel d'API qui est asynchrone, ce qui signifie que le droit après que vous appelez loginUser, auth.isAuth sera toujours faux.

Vous devez vous assurer que auth.isAuth === true sur componentDidMount de votre écran de connexion, ou utiliser quelque chose comme redux-observable pour réagir à des actions qui sont en cours de déploiement et d'effectuer la navigation.

2021-11-24 01:04:12

J'essaie d'utiliser la vérification de l'authentification et de la navigation à l'intérieur de useEffect avec tableau de dépendances emty mais le problème, apaisé.
smichi

Jetez un oeil à ce que les docs de réagir de la navigation à dire sur l'authentification des flux: reactnavigation.org/docs/auth-flow
romin21

Dans d'autres langues

Cette page est dans d'autres langues

Русский
..................................................................................................................
Italiano
..................................................................................................................
Polski
..................................................................................................................
Română
..................................................................................................................
한국어
..................................................................................................................
हिन्दी
..................................................................................................................
Türk
..................................................................................................................
Česk
..................................................................................................................
Português
..................................................................................................................
ไทย
..................................................................................................................
中文
..................................................................................................................
Español
..................................................................................................................
Slovenský
..................................................................................................................