在 React 的这种情况下，括号是什么意思？答案

【问题标题】：What does the bracket mean in this situation in React?在 React 的这种情况下，括号是什么意思？
【发布时间】：2018-08-14 06:16:18
【问题描述】：

这是 React 中的一个表单组件。我想知道在那个 onChange 事件中括号 [ ] 是什么意思？此外，我有点困惑e.target.name 等于什么？那是一个字符串"inputText"吗？

<form onSubmit={(e) => {
 e.preventDefault();
 const data = [...this.state.inputText];
 this.setState({data, inputText: ''});
}}>
<input
  type="text"
  name="inputText"
  value={this.state.inputText}
  onChange={(e) => {
    this.setState({[e.target.name]: e.target.value})
  }}
 />
</form>

任何意见或帮助将不胜感激，谢谢。

【问题讨论】：

标签： reactjs input setstate

【解决方案1】：

计算的属性名称

这是 ES6 中的新事物之一。这意味着您可以为对象动态设置key 值。

示例：

// Computed property names (ES2015)
var prop = 'foo';
var o = {
  [prop]: 'hey',
  ['b' + 'ar']: 'there'
};

阅读更多关于它here

【讨论】：

感谢您的回答，真的很有帮助！

【解决方案2】：

这是使用字符串作为键的 es6 语法。因此，在这种情况下，这相当于：

setState({inputText: <eventValue>});

【讨论】：

【解决方案3】：

是的，在这种情况下e.target.name 等于字符串"inputText"。所以在onChange你也可以认为是

this.setState({["inputText"]: e.target.value})

相当于

this.setState({inputText: e.target.value})

这种方式通常用于创建通用/可重用函数。

【讨论】：

感谢您的回答！