Селектори и хук useSelector в Redux

В предишните уроци ние записахме в store данни за продукти. Как да ги получим от store?

За да направим това, трябва да напишем функция-селектор. Тази функция знае как да извлече определена част информация от стойността на състоянието, съхранявано в store и помага да се избегне писане на повтарящ се код при разрастване на приложението. На входа тази функция приема state, а на изхода връща необходимия slice от състоянието. Например така:

jsxconst selectValue = state => state.some.value

В самото начало на учебника беше споменато, че store има метод getState. И ние лесно можехме да го използваме за получаване на стойността на състоянието:

jsxconst value = selectValue(store.getState())

Проблемът е, че нашите React компоненти не могат директно да достъпват store, тъй като е забранено да се импортира във файла на компонента. Но ние имаме възможност да получим данни в компонента с помощта на React-Redux хука useSelector. Освен това, с този хук нашите компоненти винаги ще получават само актуални данни:

jsxconst count = useSelector(selectValue)