Question

我看到有人在useEffect的第二个参数中使用0而不是空数组。

所以不是

useEffect(() => {
    console.log('Run once');
}, []);

是

useEffect(() => {
    console.log('Run once');
}, 0);

似乎有相同的效果，所以我想知道他为什么要使用它？

根据您对空数组的评估方式，将其视为0。例如[] == 0为true，但[] === 0为false。因此，在这种情况下，可能不需要进行严格的比较，如果您使用0，也没关系。

仅在响应文档之后，我将使用一个空数组。

React docs：

如果您要运行效果并仅将其清理一次（在挂载和卸载），则可以传递一个空数组（[]）作为第二个参数。这个告诉React你的效果不依赖于道具的任何值或状态，因此它不需要重新运行。这不是特殊处理情况—直接取决于依赖项数组始终如何有效。

我想知道0是在[]上使用的可能更简洁的二进制参数，还是使用0是不好的做法，或者是否无关紧要，并且[]只是首选的React约定？

谢谢。

Answer 1

不要忘记控制台日志错误说明了一切：

react-dom.development.js：88警告：useEffect收到了一个不是数组的最终参数（而是收到了number）。指定后，最后一个参数必须是一个数组。

Answer 2

由于第二个参数[]的目的，我认为使用useEffect是更好的方法。即使您要做的只是确保效果只运行一次，您仍应将参数视为依赖项数组。

Answer 3

这是useEffect函数的签名

export function useEffect(
  create: () => (() => void) | void,
  deps: Array<mixed> | void | null,
): void {
  const dispatcher = resolveDispatcher();
  return dispatcher.useEffect(create, deps);
}

您可以看到它只接受一个无效或为空的数组，因此，如果您只想运行一次数组，则正确的答案是始终发送一个数组

Answer 4

React Hook useEffect传递了一个非数组文字的依赖项列表。这意味着我们无法静态验证您是否已经传递了正确的依赖关系react-hooks / exhaustive-deps

在尝试通过放置0或null来运行代码时收到此警告所以我想发送一个数组，如果你想一次运行代码会更好

React Hooks-0与空数组作为useEffect中的第二个参数

4 个答案: