React列表收藏功能中useCallback的正确依赖项如何配置？

问题解答 #

你的useCallback依赖项只需要填入[dispatch, addFav]即可，理由如下：

• 不管你用的是Redux还是React原生的useReducer，dispatch函数的引用都是全局稳定的，组件整个生命周期内都不会发生变化
• 只要你的addFav是在组件外部定义的Action Creator，它的引用也不会随组件重渲染改变

这样处理后addFavouriteHandler的引用会全程保持不变，只要你给MovieCard包裹了React.memo，那么父组件重渲染时所有卡片的addFavourite属性都不会发生变化，只有被点击的卡片因为isFavourite属性更新才会触发重渲染，完全符合你的性能优化需求。

额外注意：对应的removeFavouriteHandler也需要用同样的逻辑用useCallback包裹，依赖项填对应的dispatch和删除收藏的Action Creator即可。

内容的提问来源于stack exchange，提问作者Lokesh Bajracharya