Игнорировать токен доступа при использовании Зависимость эффекта - PullRequest
0 голосов
/ 18 июня 2020

Я хочу получить данные о начальном рендеринге компонента. Для выборки требуется токен доступа, который хранится в контексте и доступен через настраиваемый обработчик. Когда токен доступа обновляется, я не хочу, чтобы useEffect запускался снова. Я не могу использовать токен доступа Memo, потому что на той же странице у меня есть кнопка сохранения, которая также выполняет выборку. При сохранении я хочу использовать последний токен доступа, если он был обновлен. Короче говоря, как я могу игнорировать зависимость accessToken в useEffects, но все же использовать последнее значение при запуске useEffect? ​​

  const accessToken = useAccessToken();
  useEffect(() => {
    const fetchData = async () => {
      const taskResult = await fetch("/tasks", {
        method: 'GET',
        headers: {
          'Authorization': `Bearer ${accessToken}`,
          'Content-Type': 'application/json'
        }
      });
      setTasks(taskResult);
    };
    fetchData();
  }, []);  // eslint warning because it wants accessToken as a dependency

1 Ответ

0 голосов
/ 18 июня 2020

Вы можете быть уверены, что данные были извлечены именно те, используя флаг, сохраненный в другом состоянии. Вот что я лично сделал бы:

const accessToken = useAccessToken();
const [fetched, setFetched] = useState(false);

  useEffect(() => {
    const fetchData = async () => {
      setFetched(true);
      const taskResult = await fetch("/tasks", {
        method: 'GET',
        headers: {
          'Authorization': `Bearer ${accessToken}`,
          'Content-Type': 'application/json'
        }
      });
      setTasks(taskResult);
    };
    if(!fetched) fetchData();
  }, [accessToken, fetched]);

Таким образом, у вас всегда будет последний токен доступа для выборки данных.

...