react的依赖项数组 - 实践

示例代码

useEffect(() =>
{
if (a && b === 'ticket' && formApi.current) {
formApi.current.setValues({
item1: c,
item2: d
});
}
}, [a, b, c, d]);

便捷解释一下，这段代码是逻辑是当满足a和b以及formApi.current条件时，给表单元素item1和item2分别赋值c和d。

那么[a, b, c, d]就是依赖项数组

作用

当这些依赖项中的任何一个发生变化时，重新执行前面的回调函数。假如为空数组 [] ，回调函数只会在组件首次渲染时执行一次。

react的部分钩子比如useEffect、useMemo、useCallback都有依赖项数组