这段代码如何更新 React 中的状态？

Question

我感到困惑的是 setState 参数中的 [event.target.name]: event.target.value。我之前没有在 Javascript 中看到过这个方括号表示法，所以我不明白为什么键周围有方括号。

onChange = event => {

    this.setState({ [event.target.name]: event.target.value })

};

不确定我在这里不理解/缺少什么 Javascript 构造。

Answer 1

实际上对象的键不能是表达式或函数。所以在这里你试图从事件中设置键名......使用了这种语法。

Answer 2

它看起来像一个WebAPI。接口的target属性是对Event调度事件的对象的引用。它不同于Event.currentTarget在事件的冒泡或捕获阶段调用事件处理程序。通常，DOM 中的组件（如输入组件）在其值发生更改时会传递给此函数。您可能会在此处看到一个更复杂的示例。