我有这个 React.memo 组件,只有在发送第二个参数 isEqual 函数时道具没有改变时,我才想渲染它。当我 console.log 包装组件和 memmoized 组件时,我可以看到它使用相同的道具呈现。我做错了什么?
我的包装组件
export const WrapperComponent= props => {
console.log('MemoizeComponent', props);
return (
<MemoizeComponent name="memo"/>
);
}
export const WrapperComponent;
我的记忆组件
export const Component = props => {
console.log('component: ', props.name)
return (
<div>{props.name}</div>
);
}
function isEqual(prevProps, nextProps) {
console.log(prevProps.name);
console.log(nextProps.name);
return prevProps.name === nextProps.name;
};
export const MemoizeComponent = React.memo(Component, isEqual);
控制台输出:
memo
memo
component:memo
memo
memo
component:memo