javascript - 将对象存储在 React 组件的状态中？

Question

是否可以将对象存储在 React 组件的状态中？如果是，那么我们如何使用 setState 更改该对象中键的值？我认为语法上不允许这样写:

this.setState({ abc.xyz: 'new value' });

类似地，我有另一个问题:在 React 组件中有一组变量以便它们可以在组件的任何方法中使用，而不是将它们存储在状态中是否可以？

您可以创建一个包含所有这些变量的简单对象并将其放置在组件级别，就像您在组件上声明任何方法一样。

很可能会遇到这样的情况，您在代码中包含大量业务逻辑并且需要使用许多变量，这些变量的值可以通过多种方法更改，然后您可以根据这些值更改组件的状态。

因此，不是将所有这些变量都保留在状态中，而是只保留那些值应直接反射(reflect)在 UI 中的变量。

如果这种方法比我在这里写的第一个问题更好，那么我就不需要在状态中存储对象。

Answer 1

1. this.setState({ abc.xyz: 'new value' }); 语法是不允许的。 你必须传递整个对象。

   this.setState({abc: {xyz: 'new value'}});
   

   如果abc中还有其他变量

   var abc = this.state.abc;
   abc.xyz = 'new value';
   this.setState({abc: abc});
   

2. 如果它们不依赖于 this.props 和 this.state，您可以使用普通变量。