У меня есть несколько компонентов, которые требуют одинаковых данных. Каждый компонент вызывает пользовательский хук, который загружает данные и отправляет их в Redx. Работает нормально, но данные выбираются несколько раз. Я попытался установить флаг isLoading как в Redux, так и в useContext, но в обоих случаях запрос данных запускается перед использованием useSelector или useContext, который заполняет isLoading.
EG
function useLoadData() {
const dispatch = useDispatch()
const isLoading = useSelector(state => state.isLoading)
const [fetchData, { data, loading, error, refetch }] = fetchDataHook( /* async data fetch */ )
useEffect(() => {
if (fetchData && !isLoading && !data) {
dispatch(setIsLoading(true))
fetchData()
}
}, [data, dispatch, fetchData, isLoading])
useEffect(() => {
if (data) {
dispatch(setData(data))
}
}, [dispatch, data])
return {
loading,
error,
refetch
}
}
Как установить Флаг isLoading до запуска запроса?