Question

我正在尝试更新我的状态，我有以下状态：

const [values, setValues] = useState({
   exampleValue: 280.0
 });

这是我尝试对其进行更新的功能

function handleValuesChanged(field, value) {
    setValues({
      ...values,
      field: value,
    });
  }

这是输入

<Input
   {...field}
   classes={{
     root: styles.root,
     input: styles.input,
   }}
   inputProps={{ type: 'number', min: 0 }}
   id={field.name}
   onChange={e => props.handleValues(field.name, e.target.value)}
/>

与其更改状态exampleValue（该名称在field参数中发送，而新值在value参数中），它创建了一个名为{ {1}}和新值。

如果我在field函数的硬代码中放入exampleValue，它会执行我想要的操作，但是当我尝试使用setValues参数时，它将创建一个新的状态字段。

将值写为500，我希望状态更改为：

field

相反，我得到了

exampleValue: 500

有人知道我该怎么做吗？

Answer 1

您需要使用变量field的值作为键，而不是字符串"field" =>

setValues({
  ...values,
  [field]: value,
})

注意：{field: 1}是{"field": 1}的简写，{field}是{"field": field}的简写。有关更多详细信息，请参见Working with Objects。

如何更改带有嵌套对象的状态挂钩？

1 个答案: