Selectorer og useSelector hook i Redux
I de foregående lektioner gemte vi produktdata i storen. Hvordan henter vi dem fra storen?
For at gøre dette er vi nødt til at skrive en selector-funktion. Denne funktion ved, hvordan man udtrækker et bestemt stykke information fra state-værdien gemt i storen og hjælper med at undgå at skrive gentagende kode, når applikationen vokser. Funktionen tager state som input, og output er den nødvendige slice af state. For eksempel sådan her:
const selectValue = state => state.some.value
I starten af lærebogen blev det nævnt,
at storen har en metode kaldet getState. Og vi
kunne nemt have brugt den til at
få state-værdien:
const value = selectValue(store.getState())
Problemet er, at vores React
komponenter ikke kan få direkte adgang til
storen, fordi det er forbudt at importere den
i komponentfilen. Men vi har mulighed for at
hente data i komponentet ved hjælp af
React-Redux hook'et useSelector. Desuden,
vil vores komponenter altid modtage
kun ajourførte data med dette hook:
const count = useSelector(selectValue)