Selettori e hook useSelector in Redux
Nelle lezioni precedenti abbiamo memorizzato nello store i dati dei prodotti. Come possiamo ottenerli dallo store?
Per fare ciò, è necessario scrivere una funzione selettore. Questa funzione sa come estrarre un determinato frammento di informazioni dallo stato memorizzato nello store e aiuta a evitare di scrivere codice ripetitivo quando l'applicazione cresce. In input questa funzione accetta lo state, e in output restituisce la fetta di stato necessaria. Ad esempio così:
const selectValue = state => state.some.value
All'inizio del tutorial si menzionava
che lo store ha un metodo getState. E noi
potremmo facilmente usarlo per
ottenere il valore dello stato:
const value = selectValue(store.getState())
Il problema è che i nostri componenti React
non possono accedere direttamente allo
store, poiché è vietato importarlo
nel file del componente. Ma abbiamo la possibilità
di ottenere i dati nel componente utilizzando
l'hook di React-Redux useSelector. Inoltre,
con questo hook i nostri componenti riceveranno sempre
solo dati aggiornati:
const count = useSelector(selectValue)
