首页 > 解决方案 > 防止在 onChange Input 时从子组件渲染

问题描述

我一直在尝试通过防止以下示例中的容器组件在每次子组件更新时重新渲染来优化应用程序。输入EditableRow组件onchange时如何预渲染UsersList组件?谢谢。链接代码: https ://stackblitz.com/edit/react-ts-llwq51?file=EditableRow.tsx

标签: reactjstypescriptrendering

解决方案


在您提到的示例中,组件正在重新渲染,因为状态保持在父组件中。因此,当状态发生变化时,父组件会重新渲染,并且所有依赖于状态的组件都会重新渲染。如果您在 EditableRow 组件内移动“handleEditFormChange”并在单击保存按钮时触发状态更改(setEditFormData)将防止表单数据更改时重新呈现。


推荐阅读