1
votes

Le réducteur n'a pas été appelé après le retour de l'action?

Voici mon code d'action de connexion. Qu'est-ce que je fais mal ? Comme vous pouvez le voir, la mise à jour de l'état du réducteur n'est pas appelée.

S'il vous plaît, aidez-moi les gars!

Réagissez - 16.8 Client Axios Http Node & Mongo Db Backend

export const loginUser = (userData) => {
    axios.post(URL + '/api/admin/login', userData)
        .then(res => {
            return {
                type: SIGNIN_USER,
                payload: storeData
            }

        })
        .catch(err => {
            return {
                type: SHOW_MESSAGE,
                payload: err.response.data
            }
        });
};

reactjs mongodb redux

0 commentaires

4 Réponses :

1
votes

    .then(res => {
        this.state.someResult = res;
    })

1 commentaires

non, je veux appeler la fonction de réduction à partir de l'action de répartition

1
votes

Vous devez distribuer l'action, pas simplement renvoyer l'objet:

const dispatch = useDispatch(); // Assuming you're inside functional component

export const loginUser = (userData) => {
    axios.post(URL + '/api/admin/login', userData)
        .then(res => {
            return dispatch({
                type: SIGNIN_USER,
                payload: storeData
            })

        })
        .catch(err => {
            return dispatch({
                type: SHOW_MESSAGE,
                payload: err.response.data
            })
        });
};

3 commentaires

Quel est l'intérêt de renvoyer les résultats de l'envoi? Ce n'est que rarement utile.

./src/appRedux/actions/Auth.js Ligne 31: 'useDispatch' n'est pas défini no-undef

Vous devez d'abord effectuer importer {useDispatch} depuis 'react-redux' . Plus d'informations: react-redux.js.org/next/api/hooks#usedispatch

1
votes

Essayez avec cet exemple de code:

export const loginUser = userData => dispatch => (
    axios.post(URL + '/api/admin/login', userData)
        .then(res => dispatch({ type: SIGNIN_USER, payload: res }))
        .catch(err => dispatch({ type: SHOW_MESSAGE, payload: err.response.data }))
)

3 commentaires

J'ai essayé cela, mais j'ai échoué. L'erreur comme l'action doit être un objet

cela signifie que vous ne distribuez pas correctement la fonction du composant.

consultez ce lien et suivez la bonne façon d'appeler l'action dans le composant. medium.com/backticks- tildes /…

0
votes

Utilisez les fonctions Arrow pour améliorer la lisibilité du code. Pas besoin de renvoyer quoi que ce soit dans API.fetchComments, l'appel Api est asynchrone lorsque la requête est terminée, puis obtiendra la réponse, il vous suffit de distribuer le type et les données.

Le code ci-dessous fait le même travail en utilisant les fonctions Arrow .

export const bindComments = postId => {
  return dispatch => {
    API.fetchComments(postId).then(comments => {
      dispatch({
        type: BIND_COMMENTS,
        comments,
        postId
      });
    });
  };
};

lien de référence: React-Redux: les actions doivent être des objets simples. Utilisez un middleware personnalisé pour les actions asynchrones

0 commentaires