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

Question

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

onChange = event => {
    this.setState({ [event.target.name]: event.target.value })
};

不确定我在这里不理解/遗漏了什么 Javascript 结构。

Answer 1

这仅意味着属性名称是动态的，在本例中来自 event.target.name。

我想下面的例子让你明白了

const name = 'foo';

const obj1 = {
  name: 'bar'
}

const obj2 = {
  [name]: 'bar'
}

console.log(obj1);
console.log(obj2);

这打印

{ name: 'bar' }
{ foo: 'bar' }