有没有一种方法可以使组件仅在某些状态更改时才重新渲染？

Question

我有两个reducer，我相信当从其中的一个派遣动作时，它们会使我的组件重新呈现：

    const [toDoListState, toDoListDispatch] = useReducer(toDoListReducer, []);
    const [httpState, httpDispatch] = useReducer(httpReducer, {isLoading: false, errorMsg: null});

问题是，httpState的更改使该组件毫无意义地重新呈现。是否只有在toDoListState更改时才使我的组件重新呈现？

据我所知，基于类的React组件中应该包含shouldComponentUpdate。什么与ReactHooks等效？

我用Google搜索，人们说React.memo，但是我似乎不明白它是如何工作的以及如何将其应用于我的代码。

Answer 1

我要做的方法是首先使用诸如React Profiller之类的东西来查看到底是什么使组件重新呈现。现在我知道了原因，我将使用一些技巧，例如memo或useMemo或callback来停止无用的重新渲染

Answer 2

useMemo将始终返回相同的值，直到依赖关系更改为止。例如

const memoizedValue = useMemo（（）=> computeExpensiveValue（a，b），[a，b]）;

现在让我们说一下computeExpensiveValue（1,1）=== 2

意味着memoizedValue现在将始终返回2，而不会执行计算，直到a或b更改为止。

但是真正的问题是：如果不希望它更新组件，为什么需要http状态？