反应空 useEffect

【问题标题】：React empty useEffect反应空 useEffect
【发布时间】：2020-07-08 23:38:31
【问题描述】：

尽管我使用 React 已经有一段时间了，但我无法弄清楚这一点。为什么空的 UseEffect 会导致组件重新渲染？问题是我得到了两个console.logs。天呐！

function App() {
  useEffect(() => {

  }, [])

  console.log('render')

  return (
    <h1>Hello world</h1>
  );
}

【问题讨论】：

可能strict mode效果不会导致App重新渲染。
就我而言，它只显示了一次。
@HMR 提到严格模式后，我做了一些谷歌搜索，发现我的组件被包裹在中。删除后，我只得到一个渲染。这个链接也很有帮助github.com/facebook/react/issues/15074

【解决方案1】：

空的useEffect订阅了组件的所有props。

useEffect(() => console.log('rerendered due to new props'));

任何useEffect 在第一个组件渲染后至少工作一次。所以你可以像componentDidMount一样使用它。

如果你只想像componentDidMount 那样使用它，你必须传递一个空数组作为第二个参数。

useEffect(() => console.log('after first render'), []);

订阅特定的道具：

useEffect(() => console.log(' after first render or message updated', props.message), [props.message]);

【讨论】：