web-dev-qa-db-fra.com

Accès à un état de réducteur à partir d'un autre réducteur

J'ai un réducteur par lequel je réaccorde l'état approprié lorsqu'une action est envoyée. Maintenant, j'appelle une API à intervalles réguliers afin que le résultat déclenche une action encore et encore. Donc, ce que je veux, c'est que si l'état du réducteur contient déjà des données, un autre réducteur n'affiche pas l'état en cours de chargement pendant l'appel. Il doit conserver son état de chargement lors de la première réception de données uniquement. J'espère pouvoir l'expliquer correctement

Voici mes extraits de code

Réducteur d'état de chargement

const loading = (state = false, action) => {

    switch (action.type) {
    case 'GET_AUDIT_DATA':         // here I want to return true only when there is no data available
        return true
    case 'GET_AUDIT_DATA_RECEIVED':  
        return false
    case 'GET_AUDIT_DATA_ERROR':
        return false
    default:
        return state
    }
}

Combinaison de réducteurs

const allReducers = combineReducers({
    auditData: AuditData,
    auditLoading: AuditLoading,
    modifiedOrders: ModifiedOrders
});

export default allReducers;

Réducteur renvoyant des données sur l'action déclenchée par le superagent

const auditData = (state = [], action) => {
    switch(action.type) {
        case 'GET_AUDIT_DATA_RECEIVED': 
        console.log(action.data);
            return action.data;
        case 'GET_AUDIT_DATA_ERROR': 
            return action.err;
        default :
            return state;
    }
}
export default auditData;

Donc, initialement, le auditData ne contient aucune donnée, seulement après le premier appel réussi, il renvoie les données. Lorsque cela est appelé en même temps loading state reducer est appelé et devrait retourner vrai dans GET_AUDIT_DATA action uniquement lorsque le réducteur de données d'audit ne contient aucune donnée.

Renvoie également uniquement les données actuellement obtenues de auditData dans le bon sens, ou je devrais le faire différemment. Fondamentalement, je veux overwrite le current data avec le new one.

reactjsreduxreact-reduxreducers
12
Shubham Khatri

La meilleure façon de procéder est d'envoyer à Loading state reducer une information pour savoir si l'autre réducteur a déjà des données. A avoir à la fin:

const loading = (state = false, action) => {

    switch (action.type) {
    case 'GET_AUDIT_DATA':
        if(!action.dataAlreadyInitialized){
            return true
        }
    case 'GET_AUDIT_DATA_RECEIVED':  
        return false
    case 'GET_AUDIT_DATA_ERROR':
        return false
    default:
        return state
    }
}

Vous devez avoir accès depuis votre fonction d'action à l'état de l'application et faire:

dispatch({
  type:'GET_AUDIT_DATA',
  dataAlreadyInitialized: appState.auditData.length > 0
});
2
Damien Leroux

Vous pouvez appeler getState() sur un magasin pour obtenir la liste des réducteurs et l'état actuel à l'intérieur des réducteurs.

  1. Importez le store dans auditLoading (utilisez le magasin pour obtenir des valeurs. Ne modifiez pas le magasin)
  2. store.getState().auditLoading vous donnera l'état de auditLoading réducteur.

Cette approche est similaire au rappel fourni par redux-thunk. Dans lequel (dispatch, getState) => {} sera renvoyé à l'action.

9
Pranesh Ravi
import store from '../../../redux/store'

console.log(store.getState().loginReducer.accessToken)

Grâce à cette déclaration, nous obtiendrons l'état d'accès

1
Apurva Aggarwal