react-hooks - useEffect 导致无限循环

Question

我搜索 SO 帖子“useEffect 导致无限循环”，看起来还有 36 个其他关于此的 SO 帖子。大多数答案都说要传入一个依赖数组。像这样的东西...

  useEffect(() => {
    // do something and then do ...
    setMatch(match);
  },[match]);

好吧，这就是我尝试过的。我尝试过的所有 useEffect() 仍然给我无限循环。

我试过这个（没有依赖数组）

   useEffect(()=> {

        const url = 'http://localhost:8000/rest-auth/user/';
        const withCredentials = true;
        const method = 'get';
        axios.request({method, url, withCredentials}).then(response => {
            setAppUser({...appUser, ...response.data});
            setLoggedIn(true);
        })
    });

我试过这个（空依赖数组）

   useEffect(()=> {

        const url = 'http://localhost:8000/rest-auth/user/';
        const withCredentials = true;
        const method = 'get';
        axios.request({method, url, withCredentials}).then(response => {
            setAppUser({...appUser, ...response.data});
            setLoggedIn(true);
        })
    }, []);

我试过这个（放入appUser依赖数组）

   useEffect(()=> {

        const url = 'http://localhost:8000/rest-auth/user/';
        const withCredentials = true;
        const method = 'get';
        axios.request({method, url, withCredentials}).then(response => {
            setAppUser({...appUser, ...response.data});
            setLoggedIn(true);
        })
    }, [appUser]);

更新：我试过这个：

   useEffect(()=> {

        const url = 'http://localhost:8000/rest-auth/user/';
        const withCredentials = true;
        const method = 'get';
        axios.request({method, url, withCredentials}).then(response => {
            setAppUser((appUser) => ({...appUser, ...response.data}));
            setLoggedIn(true);
        })
    }, []);

上述所有四种方法都会导致无限循环。

标签： react-hooks