Проблема с несколькими компонентами, импортирующими один и тот же пользовательский хук, который выбирает данные и отправляет их в Redux - PullRequest
0 голосов
/ 27 января 2020

У меня есть несколько компонентов, которые требуют одинаковых данных. Каждый компонент вызывает пользовательский хук, который загружает данные и отправляет их в 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 до запуска запроса?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...