Reactjs 在React JS中设置状态

我的组件状态如下所示：

  this.state = { 
        user: {firstname: '', lastName: '', phoneNumber: '' }
     }

在输入更改事件中，我要设置状态。但是下面的代码似乎不起作用。我愚蠢地做错了什么

 handlePhoneNumberChange(e){
     this.setState({["users"]['phoneNumber']: e.target.value});
  }

---

我不确定你在做什么，但如果你想设置当前用户的电话号码：

this.setState({ user: { ...this.state.user, phoneNumber: e.target.value } })

假设您可以访问实验性ES功能，如spread

否则,

this.setState({ user: Object.assign({}, this.state.user, {phoneNumber: e.target.value}) })

---

我不确定你在做什么，但如果你想设置当前用户的电话号码：

this.setState({ user: { ...this.state.user, phoneNumber: e.target.value } })

假设您可以访问实验性ES功能，如spread

否则,

this.setState({ user: Object.assign({}, this.state.user, {phoneNumber: e.target.value}) })

---

您应该像这样更新状态：

handlePhoneNumberChange(e) {
   let user = this.state.user;
   user.phoneNumber = e.target.value;
   this.setState(user);
}

您可能还想研究一下，这将显著地清理这个过程

---

编辑：将“排列运算符”更改为“排列属性”，谢谢Felix。

您应该像这样更新状态：

handlePhoneNumberChange(e) {
   let user = this.state.user;
   user.phoneNumber = e.target.value;
   this.setState(user);
}

您可能还想研究一下，这将显著地清理这个过程

---

编辑：谢谢Felix，将“spread operator”更改为“spread properties”。

您所建议的spread properties实际上是一个实验特性。它还不是任何版本的ES的一部分。啊，我的错，巴贝尔让人很容易忘记你所说的，传播属性，实际上是一个实验性的特性。它还不是任何版本的ES的一部分。啊，我的糟糕，巴贝尔让人很容易忘记

{[“用户”]['phoneNumber']：e.target.value}

是无效的JavaScript（这与React无关）。

{[“用户”['phoneNumber']：e.target.value}

是无效的JavaScript（这与React无关）。您可能希望将函数传递给setState，因为.setState是异步的。在这种简单的情况下，可能不会有问题。但是像这样传递函数被认为是一种很好的做法：。如果您指的是spread属性，那么您应该这么说。@FelixKling哦，我的错，谢谢您的更正：）您可能需要将函数传递给setState，因为.setState是异步的。在这种简单的情况下，可能不会有问题。但是像这样传递函数被认为是一种很好的做法：。如果你指的是传播属性，那么你应该这么说。@FelixKling哦，我的错，谢谢你的更正：）