Question

如何在此处将err传递给errors : {}？

const data = { name: "", errors: {} }
const [values, setValues] = useState(data)
const handleSubmit = () => {
     const err = validate();  // I receive an object in err
    setValues({ ...values, errors: err }) // I cant set err to //errors: {} above
}

Answer 1

从React DOCs - State Hook，我们得到：

状态变量可以很好地保存对象和数组，因此您仍然可以将相关数据分组在一起。但是，与类中的this.setState不同，更新状态变量始终会替换它而不是合并它。

另外，来自Hooks FAQ：

现在假设我们要编写一些逻辑，以在用户移动鼠标时更改left和top。注意我们如何手动将这些字段合并到以前的状态对象中
：
function handleWindowMouseMove(e) {
     // Spreading "...state" ensures we don't "lose" width and height
     setState(state => ({ ...state, left: e.pageX, top: e.pageY }));
   }

因此，您当前的操作方式是正确的。

Answer 2

您建议的方法只有在方法validate()返回对象时才有效。

如果validate()返回一个字符串，数组，则分配setValues({ ...values, errors: err }) 可能会中断，因为errors期望一个 object

在react hooks中，如何将新创建的对象传递给状态对象？

2 个答案: