使用React的getDerivedStateFromProps时如何正确返回更新后的state？

直接给结论：完全不需要。

React 对 getDerivedStateFromProps 返回的状态对象，默认会执行浅层合并逻辑：只会更新你返回对象里明确写了的字段，其余原来 state 里的字段会完整保留，根本不会被覆盖。

比如你原始 state 是：

state = { hasSomething: true, anotherKey: '', otherField: 1 }

你只要返回 { hasSomething: false }，React 合并后得到的完整 state 就是：

{ hasSomething: false, anotherKey: '', otherField: 1 }

和你手动写 ...prevState 得到的结果没有任何区别，多写解构完全是多余操作。

为什么有人会习惯性写解构？ #

基本都是和函数组件 useState 的更新逻辑搞混了：

• 类组件的 setState、getDerivedStateFromProps 返回的更新对象，默认走浅层合并逻辑，不需要手动保留其他字段
• 只有函数组件的 useState 更新不会自动合并，如果你要修改对象类型 state 的部分属性，才需要手动解构之前的状态再返回

你测试时不解构也能拿到完整 state 是完全符合 React 设计的，不需要有顾虑。

内容的提问来源于stack exchange，提问作者Oh this crazy voices