反应useEffect，依赖列表不起作用答案

【问题标题】：React useEffect, dependency list not working反应useEffect，依赖列表不起作用
【发布时间】：2020-05-18 19:54:38
【问题描述】：

我确定我对此有错误的理解。我有以下组件

const Comp = () => {
    const filter = 'a';

    useEffect(() => {
      console.log('executing effect');
      loadFriends();
    }, [filter]);


    return (
      <Div>
        {friendsFilter}
      </Div>
    );
  };

现在根据我的理解，由于useEffect 上的依赖列表是filter，所以当组件再次渲染时，react 不应该运行效果吗？但是它似乎运行它。我在这里理解有什么问题吗？

【问题讨论】：

使用componentDidMount()重新渲染
我没有尝试使用 componentDidMount 或重新渲染。我想问为什么即使filter 值没有改变它也会运行效果？
这里肯定有其他事情发生，我确定这是精简代码，你能提供一个更详细的例子吗？
你的 loadFriends() 在做什么？你能发布完整的代码吗？
分享 loadFriends() 块的代码。可能它改变了过滤器的值。

标签： reactjs react-hooks use-effect react-effects

【解决方案1】：

如果您只希望它运行一次，请使用空数组作为依赖项值，而不是 `[filter]'。

【讨论】：

【解决方案2】：

好吧，我已经测试了你的用例，但它没有调用 useEffect 块。

这是我测试过的代码。

import React, { useEffect, useState } from "react";

const Comp = () => {
  const [count, setCount] = useState(0);
  const filter = "a";

  useEffect(() => {
    console.log("executing effect");
    //loadFriends();
  }, [filter]);

  return (
    <div>
      Div
      <button onClick={() => setCount(count + 1)}> Click me</button>
      Count: {count}
    </div>
  );
};

export default Comp;

Link to codesandbox 即使更改了组件重新渲染的计数，但不会调用 useEffect 块。

loadFriends() 中很可能发生了一些事情，正在改变过滤器的值。