虽然很明显为什么React
默认情况下不对它的所有功能组件执行 React.memo,但我们应该在需要时自己包装我们的功能组件。
就我而言,我有一个大型react项目,其结构如下:
const MyBigApp = () => {
const shouldShowX = useSelector(getShouldShowX);
const shouldShowY = useSelector(getShouldShowY);
// Many more selectors
return (
<>
{shouldShowX && <ComplexComponentX />}
{shouldShowY && <ComplexComponentY />}
{/* many more components based on different selectors like above */}
</>
);
};
我所有的业务逻辑都在 redux 中,组件在useSelector
内部使用以从存储中获取数据。
用 包装我的所有子组件是否有意义React.memo
,因为根级别的任何选择器的更改都会导致我的整个应用程序重新呈现?
早些时候,connect
我们自动获得了一个记忆化组件,它比较了自定义props和作为props传递给组件的存储值,那么我们现在应该在没有接收任何props的组件中使用时手动总是这样做吗?React.memo
useSelector