现在使用 use useEffects，可以componentDidMount使用 Hooks代替into 一个 React 组件。
场景“对服务器的初始唯一调用”：
为了实现这一点，DependencyList（的第二个参数useEffect）useEffect每次都应该是一个空数组，否则应用程序将向服务器发送每个状态更改的 fetch 调用。
这意味着，这是 getData 的最佳实践
useEffect(() => {
console.log("useEffect, fetchData here");
}, []);
最佳实践是[]用作 DependencyList 参数来禁用请求每个状态更改的服务器吗？
是的。这是最好的方法。
从react文档：
传入一个空数组 [] 的输入告诉 React 你的效果不依赖于组件的任何值，所以效果只会在安装时运行并在卸载时清理；它不会在更新上运行。
useEffect是一个非常强大的，也是我最喜欢的钩子。您可以通过将一个或多个变量传递到第二个参数数组来监视一个或多个变量的状态更改，或者您可以使用您正在使用的方法监听挂载和卸载。
这取决于您是否希望在某些参数更改时调用服务器。如果您无论如何都想要相同的异步调用，则可以将其[]用作第二个参数。
但是，例如，如果您要显示用户的个人资料页面，其中每个页面都有一个用户 ID 状态/属性，则应将该 ID 作为值传递给第二个参数，useEffect以便为新用户 ID 重新获取数据. componentDidMount在这里是不够的，因为如果您直接从用户 A 转到用户 B 的配置文件，则该组件可能不需要重新安装。
在传统的类方式中，你会这样做：
componentDidMount() {
this.fetchData();
}
componentDidUpdate(prevProps, prevState) {
if (prevState.id !== this.state.id) {
this.fetchData();
}
}
使用钩子，那将是：
useEffect(() => {
this.fetchData();
}, [id]);
尝试运行下面的代码并查看结果。例如，将 id 更改为 2 以查看useEffect再次运行。
function Todo() {
const [todo, setTodo] = React.useState(null);
const [id, setId] = React.useState(1);
React.useEffect(() => {
if (id == null || id === '') {
return;
}
fetch(`https://jsonplaceholder.typicode.com/todos/${id}`)
.then(results => results.json())
.then(data => {
setTodo(data);
});
}, [id]); // useEffect will trigger whenever id is different.
return (
<div>
<input value={id} onChange={e => setId(e.target.value)}/>
<br/>
<pre>{JSON.stringify(todo, null, 2)}</pre>
</div>
);
}
ReactDOM.render(<Todo />, document.querySelector('#app'));<script src="https://unpkg.com/react@16.8.1/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16.8.1/umd/react-dom.development.js"></script>
<div id="app"></div>你应该仔细阅读，useEffect这样你就知道你可以/不能用它做什么。