useCallback挂钩的第二个参数

Question

许多React挂钩具有该挂钩依赖的第二个参数。

1. 省略第二个参数是否与提供一个空数组相同？

2. 提供useState函数（例如setFoo而不是变量）有什么用？

      const [foo, setFoo] = useState('')
   
      const cb = useCallback(() => {
      // do somethin
      }, [setFoo])
   

Answer 1

省略第二个参数是否等于提供一个空数组？

不，完全没有。

每个渲染都会调用钩子，但是依赖关系的值将重新计算或调用它们的回调。指定一个空数组可确保该挂钩将被调用一次，而不会再次调用，类似于基于类的组件的componentDidMount生命周期函数。但是，完全省略依赖项数组，只会在每次渲染时调用效果。

对于useCallback之类的东西，这将完全否定记住回调函数的目的，因为每个渲染周期都会收到一个新的回调引用。

提供useState函数（例如setFoo

）有什么用？

提供一个大概调用状态设置器的稳定的回调引用。但这没有多大意义，因为useCallback本质上是这样的：

const memoizedCallback = useCallback(
  () => {
    doSomething(a, b);
  },
  [a, b],
);

注意

不将依赖项数组作为参数传递给回调。 从概念上讲，这就是它们所代表的：每个价值 回调中引用的引用也应出现在依赖项中 数组。将来，足够先进的编译器可以创建 该数组自动。

useState设置器不是稳定的函数引用，这意味着每个渲染周期都需要重新定义，这意味着任何备注的回调也将重新计算。如果组件正在使用设置器，则只需使用它即可。

在依赖项数组中声明一个函数仅在将其作为回调传递给组件 时才有意义。