redux recupera l'elemento dallo stato o preleva dal server

Question

Ho molta confusione quando si tratta del modo "giusto" di fare le cose nel mondo redux. Diciamo che ho un riduttore che contiene un elenco di foos e che questi foos possono essere caricati completamente con tutte le informazioni che il server ha su foo o solo parzialmente caricato.

Nell'app ho due visualizzazioni/stati uno dove ho un elenco di foos e uno in cui visualizzo i dettagli di un singolo foo.

Quando visualizzo i dettagli di un foo, voglio passare attraverso alcune fasi per determinare se/quali dati devo recuperare dal server. Questo processo decisionale è qualcosa del genere:

1) Ho navigato direttamente alla vista dettagli del foo. Non c'è niente nel negozio di redux su questo foo e voglio andare a recuperare una serie completa di informazioni sul foo dal server.

2) Ho già colpito la visualizzazione elenco dove posso recuperare informazioni parziali sulla foo, quando osservo i dettagli vista voglio prendere solo le informazioni aggiuntive mi manca per questo foo

3) Ho in precedenza ho visto la vista di un oggetto in modo tale che le informazioni di cui ho bisogno sono già nel redux store quindi non c'è bisogno di recuperare altro dal server

Ora dimenticando il fatto che i dati nel negozio di redux avranno bisogno di essere aggiornati se non aggiornati. Sono confuso su come realizzo queste tre cose mediante azioni condizionatamente dispacciate. Fondamentalmente voglio inviare le azioni per recuperare parzialmente o completamente i dati e impostare l'elemento selezionato da visualizzare.

Quando sono nella visualizzazione dettagli, posso collegare il foo dal negozio direttamente agli oggetti di scena SE ho tutte le informazioni richieste. In caso contrario, ho bisogno di inviare un'azione per recuperare completamente o parzialmente dati aggiuntivi per i miei dati foo. Sulla parte posteriore di questa azione è stato completato e il riduttore aggiungendo il pippo completo alla lista di foo nel mio stato, allora voglio trovare quello appropriato e assegnarlo allo stato/oggetti del componente.

Mentre comprendo le parti di questo ho bisogno di raggiungere non so quando e dove dovrei fare ogni parte di questo processo.

Per facilità, si parte dal presupposto che ogni foo abbia un id, quindi trovare il foo nel mio stato è un filtro di quell'id.

Spero che questo abbia senso, qualsiasi aiuto è benvenuto e ci sono schemi comuni per questo concetto "recupera dalla cache dello stato locale o ripiega sul server se manca".

Chris

Answer 1

è possibile esaminare lo stato Redux corrente all'interno di un creatore di azione asincrona e quindi condizionato aggiornare lo stato. Quindi, ogni volta che potrebbe essere necessario aggiornare lo stato locale dal server, inviare l'action creator e lasciare che gestisca il processo decisionale. Potresti farlo in componentDidMount. Se stai usando Redux Thunk, puoi passare lo stato attuale in questo modo:

export default function fetchFooBar() { 
    return (dispatch, getState) => { 
     const state = getState(); 

     if (! state.foo.bar) { 
      // fetch and dispatch 
     } 
    } 
}