@PAVLIK_GYRA

Как избавиться от двойной передачи данных через useContext?

Есть App.js в котором передаю через useContext state компоненту. Далее в компоненте в useEffect я использую этот стейт НО!! приходит сначала undefined потом стейт меняется на нужный. Проблема в том, что useEffect'e идёт запрос данных на сервер и получается 2я нагрузка.
App.js
<UserContext.Provider value={{ user, setUser }}>
        <Header />
      </UserContext.Provider>


Header.js

const { user, setUser } = useContext(UserContext)

  useEffect(() => {
    const token = user.token
    const getResouce = async () => {
      const getRes = await axios
        .get('/api/game/res', {
          headers: { 'x-auth-token': token },
        })
        .catch((error) => {
          console.log(error.response)
        })
    }
  }, [user])


Получается сначала user = undefined axios выдаёт ошибку потом user меняется и перерендерится уже нормально. Как это обойти?
  • Вопрос задан
  • 200 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы