在设定状态作出反应JS

我的组件的状态如下：在设定状态作出反应JS

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

上的输入变化的事件，我想设置状态。但下面的代码似乎没有工作。我愚蠢地做错了什么？

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

来源

2017-07-18 Yoni Messing

'{[“users”] ['phoneNumber']：e.target.value}'是无效的JavaScript（这与React无关）。 –

您应该更新状态这样，而不是：

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

您可能还需要寻找到ES6 spread properties，其中显著清理这个过程了。

编辑：更改“传播运营商”为“传播属性”，谢谢Felix。

来源

2017-07-18 23:22:20

你可能想传递一个函数setState，因为.setState是异步的。在这种简单的情况下，可能不会有问题。但它被认为是一个很好的实践，而不是像这样传递函数：https：//facebook.github.io/react/docs/state-and-lifecycle.html#state-updates-may-be-asynchronous –

['.. .'不是一个操作符！]（https://stackoverflow.com/questions/37151966/what-is-spreadelement-in-ecmascript-documentation-is-it-the-same-as-spread-oper/37152508#37152508 ）。如果你指的是** **属性**，那么你应该这样说。 –

@FelixKling哦，我的不好，谢谢你的更正:) –

我真的不知道自己在做什么，但如果你想设置当前用户的电话号码：

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

假设你有机会到实验ES功能，如传播。

否则，

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

来源

2017-07-18 23:15:29

你在暗示什么，传播属性，实际上是一个*实验*功能。它不是任何版本的ES的一部分。 –

啊，我的坏，babel很容易忘记 –

在设定状态作出反应JS

回答

相关问题