[英]React.memo not working on a functional component
我尝试使用React.memo()来防止在我的一个组件上重新渲染,但只要其Parent Component发生更改,它就会继续重新渲染。
这是我的带有 React.memo() 的子组件
const Transactions = React.memo(() => {
console.log('rerender')
return (
<></>
)
})
这是它被调用的地方。 每当我单击“添加”按钮时,它都会调用 state function setModal(true),正在重新渲染事务组件
const ScholarHistory = ({setModal}) => {
return (
<div className="pml-scholar pml-scholar--column">
<div className="pml-scholar-container">
<button onClick={() => setModal(true)} className="pml-scholar-add-button"> Add </button>
</div>
<Transactions />
</div>
)
}
我是 React 新手,一直在探索/创建更广泛的项目。 任何想法为什么它会继续重新渲染? 谢谢!
我试图删除 ScholarHistory 组件上的setModal道具,并且能够防止重新渲染。
我不确定是什么原因导致它,因为它与子组件完全没有关系,除了作为父组件的道具 - ScholarHistory 。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.