我应该记住自定义钩子中的函数吗？

Question

我有计数器组件。我用自定义钩子封装了业务逻辑。我应该通过各种方式优化功能useCallback吗？如果有输入onchange处理程序，情况会一样吗？

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

？

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

砂

Answer 1

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

但记住在优化之前进行测量。- 甚至官方文件都说要轻松做到这一点。

Answer 2

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

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

您不需要在计数更改时重新创建增量，因为您可以将回调传递给状态设置器函数。