реагировать useEffect с массивом зависимостей все еще в цикле - PullRequest
Новая
       8

реагировать useEffect с массивом зависимостей все еще в цикле

0 голосов
/ 09 февраля 2020

Я пытаюсь обернуть голову вокруг крючка useEffect. Насколько мне известно, если в ловушку включен массив зависимостей, эффект будет работать только в том случае, если этот конкретный фрагмент состояния изменится, однако я не могу заставить его работать. Каждый раз, когда я добавляю массив зависимостей, он зацикливается бесконечно. 


    useEffect(() => {

      axiosWithAuth()
        .get(`/api/parent/children/${id}`)
        .then(response => {
          // console.log('API response: ', response);
          // console.log('childs data: ',response.data);
          setData(response.data)
          // console.log('new data: ', data);
        });
      .catch(err => console.log(err));
    }, [data]);

Если я извлекаю данные из массива зависимостей, он работает нормально, без зацикливания. Предполагается, что, если пользователь нажимает на имя ребенка, он отображает данные для этого ребенка (это работа по отслеживанию хозяйственной деятельности, над которой я работаю), поэтому я ДОЛЖЕН (и могу ошибаться), что ...

Я думаю, что мог бы ответить на этот вопрос самостоятельно, но мне хотелось бы получить подтверждение:

Мне нужно задать часть состояния для ребенка, и если состояние ТА изменится, то эффект запускается .. так .. как-то так .. 


    const {data, setData} = useState([]);
    const {child, setChild} = useState('');

      useEffect(() => {

        axiosWithAuth()
          .get(`/api/parent/children/${id}`)
          .then(response => {
            // console.log('child list response: ', response);
            // console.log('childs data length',response.data.length);
            // console.log('childs data',response.data);
            setData(response.data)

            // console.log('new data: ', data);
          });
          .catch(err => console.log(err));
      }, [child]);

Правильно ли мое мышление в том, что мне нужно делать это таким образом, а не так, как у меня было?

1 Ответ

1 голос
/ 09 февраля 2020

Да, у тебя все хорошо. Но лучший ответ для такого рода проблем: 

useEffect(() => {
        axiosWithAuth()
          .get(`/api/parent/children/${id}`)
          .then(response => {
            // console.log('child list response: ', response);
            // console.log('childs data length',response.data.length);
            // console.log('childs data',response.data);
            setData(response.data)

            // console.log('new data: ', data);
          });
          .catch(err => console.log(err));
} , []})

Когда вы передаете пустой массив для использованияEffect, он запускается только один раз

...