javascript - 更新对象 Javascript 中的单个字段

Question

我需要更改问题对象中特定字段的状态:

  const [problems, setProblems] = useState({
    first_name: false,
    last_name: false,
    city: false,
    email: false,
    password: false,
  });

我在下面尝试了类似的操作，但它只为我更新了错误 Object.keys(error.response.data) 列表的最后一个值:

.catch((error) => {
        Object.keys(error.response.data).map((err) => {
          setProblems({ ...problems, [err]: true });
        });
      });

error 是一个对象，它的键与 problems 对象中的键同名。我怎样才能正确地执行此操作以更新所有字段？

Answer 1

它只用最后状态值更新状态是因为关闭状态。

状态在组件的特定渲染中是恒定的；为了看到更新后的状态，组件必须重新渲染。

由于您在同一渲染中多次调用 setProblems():

setProblems({ ...problems, [err]: true });

problems 在上面的语句中指的是 same 在 Object.keys(...).map(... ) 被调用。简而言之，每次调用 setProblems 时，您都在传播相同状态。

解决方案

你需要做的是:

1. 首先创建要保存在状态中的对象

   const newState = { ...problems };
   
   Object.keys(error.response.data)
         .forEach((err) => newState[err] = true);
   

2. 调用状态设置函数

   setProblems(newState);