Selektorer och useSelector-hooken i Redux

I tidigare lektioner lade vi till produktdata i storen. Hur får vi ut dem ur storen?

För att göra detta behöver vi skriva en selektorfunktion. Denna funktion vet hur man extraherar en specifik del av information från state-värdet som lagras i storen och hjälper till att undvika att skriva upprepande kod när applikationen växer. Funktionen tar state som indata och returnerar den nödvändiga delstatten. Till exempel så här:

jsxconst selectValue = state => state.some.value

I början av handledningen nämndes det att storen har en metod som heter getState. Och vi kunde lätt ha använt den för att få state-värdet:

jsxconst value = selectValue(store.getState())

Problemet är att våra React- komponenter inte kan komma åt storen direkt, eftersom det är förbjudet att importera den till komponentfilen. Men vi har möjlighet att få data i komponenten med hjälp av React-Redux-hooken useSelector. Dessutom kommer våra komponenter alltid att få endast aktuella data med denna hook:

jsxconst count = useSelector(selectValue)