我应该回忆一下自定义钩子中的功能吗？

Question

我有计数器组件。我用自定义钩子封装了业务逻辑。我应该用useCallback来优化函数吗？如果在变更处理程序上有输入，情况会相同吗？

const increment = () => {
    setCount(count + 1);
};

↓

const increment = useCallback(() => {
    setCount(count + 1);
}, [count]);

沙子

Answer 1

假设count和setCount来自const [count,setCount] = useState(0)，那么您应该以以下方式使用回调，这样增量函数在组件的生命周期中保持不变：

const increment = useCallback(() => setCount(count => count + 1),[]);

当计数发生变化时，不需要重新创建增量，因为可以将回调传递给状态设置器函数。

Answer 2

在功能组件范围内声明的每个函数都应该是memoized或带有useCallback的cached。如果它从组件范围引用其他变量或函数，则应该在其dependency list中列出这些变量或函数。否则，每个prop/state更改都将重新创建该函数，这是很少使用的行为。

但是在优化之前要记住测量。-即使是官方的文件也说要轻松处理这件事。