如何在对象中使用动态属性

Question

我有一个具有动态参数的handleInputBlur函数。说我有this.props.user对象这样

{ name: 'abc', age: 10 } 

然后在我的UI我能做联编辑，所以handleInputBlur将获得名changeField的参数，它是一个包含更改的字段的对象：

{ age: 10 } 

我仍然必须将整个对象传递回后端，我如何用现有对象替换更新后的字段？

我试过，但得到了一个意外的标记错误：

handleInputBlur = (changedField) => { 

    const existingUser = this.props.user 

    const updatedUserObj = Object.assign({}, existingUser, { 
     existingUser[changedField]: changedField 
    }) 
} 

如何更新基于changedField的键和值的现有用户？

Answer 1

使用computed property names通过围绕该与括号中的表达式，以便它的计算值被用作密钥的密钥：

const key = Object.keys(changedField)[0]; 
const updatedUserObj = Object.assign({}, existingUser, { 
    [key]: changedField[key] 
}) 

首先，表达key的值将被计算，则该值将是用作钥匙。请注意0​​是key的值。它所做的是获取changedField对象内的第一个键 - 正在更改的属性，例如'name'或'age'。然后，通过访问changedField中的第一个键的值，将该属性设置为新属性的值。