在 React 中处理表单时,如何避免 useState 导致的重复渲染问题
维护过几个中后台项目的人大概率都遇到过这种场景:一个表单页有十几个输入项,每个输入项都用 useState 单独管理,输入的时候光标卡顿,或者打开 React DevTools 的 highlight updates 功能,发现明明只改了一个字段,整个表单组件树却全部重新渲染了一遍。出现这种情况通常不是 React 自身的问题,而是状态粒度过细或过粗、更新逻辑没有收敛导致的。这篇文章从实际代码出发,聊一下 useState 在表单场景下的渲染行为,以及几种让状态更新更可控的写法,包括状态合并、受控与非受控的取舍、useReducer 的使用时机,以及如何用 React.memo 避免子组件无意...