使用一个变量作为对象名称，以便使用扩展操作符(Reactjs)进行更改

Question

我对reactjs和javascript相当陌生，所以我不确定正确的语法。

我想使用扩展运算符来更新一个对象，但不是硬编码字段名，而是希望它是一个变量，但它将其读取为字段名，而不是将变量值作为字段名。

例如,这是我的变量

let [obj, setObj] = useState({'title': '', 'body': ''})

我这样更新它:

const onChangeCallBack(field, value){
if(field === 'body'){
setObj(obj => ({...obj, 'body': value}))
}else if(field === 'title'){
setObj(obj => ({...obj, 'title': value}))
}
}

我想更新这样的东西:

const onChangeCallBack(field, value){
setObj(obj => ({...obj, field: value})) // This doesn't work
setObj(obj => ({...obj, {field}: value})) // This doesn't work either
}

那么是否有一种方法可以指定该字段是一个变量，以其值作为变量名称?

Answer 1

setObj(obj => ({...obj, [field]: value}))

使用方括号来使用动态键。

Answer 2

动态键需要用方括号括起来，像这样:

{ [myDynamicKey]: value }

的主题:用动态创建对象键