javascript - 在 this.state 中使用嵌套对象的最佳方法是什么？

Question

我正在阅读 react 文档 State Updates are Merged当我们像这样设置一个对象时，它有一部分说:this.setState({comments}) 它完全取代了 this.state.comments。

所以，我想知道在事件 onChangeText 上更改 user 对象的 name 的方法是否有效，因为整个对象将每次调用 onChangeText 时都会被替换。

这是一种好的做法还是会产生副作用，例如性能不佳？

示例代码:

this.state = {
    user:{
        name: "",
        surname: "",
    },
    isLoading: false
};
/***/
onChangeText={name => this.setState({
  user: {
    ...user,
    name
  }
})}

Answer 1

不可变性是一方面，性能又是另一方面。

不可变性意味着您不应该使用相同的引用来更新一个对象，而应该用一个新的引用来替换。在 React 中，这是推荐的，因为只有当对象是新的时才会发生大量更新。如果您在状态中重新使用 user，更改名称然后用它更新状态，则可能会产生问题。这就是为什么它是一个建议，在大多数情况下，React 魔法将对其他人起作用，但它无法区分。所以你必须

const copy = Object.assign({}, this.state.user);

您可以在 the power of not mutating data 中查看此解释

这种情况下的性能与您有关，因为它是一个文本监听器，没关系，React 在虚拟 DOM 中跟踪 UI，因此它只能更新不同的部分。这意味着除了新 Angular 色或删除 Angular 色外，一切都将保持不变。

你可以试试 clock example in the doc for that .