ReactJS:更新已填写的表单，并在取消后返回初始状态

Question

我现在想知道取消后如何返回表单的初始状态。

这是一个场景：

1. 我有一个需要更新的用户信息表
2. 在表格中，我已经可以看到我的数据了
3. 我更改了其中一个字段中的值
4. 更改值后，我意识到我还不想更新它，所以我单击取消

当我单击"取消"时，它应该会返回到原始数据。

我目前的情况是，当我点击取消时，我使用的是resetFields((；清除所有输入字段的函数。

const cancel = () => {
form.resetFields()
}

有什么建议吗？

Answer 1

您需要保存初始状态，取消时不保存.resetFields()，而是使用.setFields({})重置。

阅读有关表单实例的文档

这里的例子：

form.setFields({ ...state })

初始状态保存格式：

{
firstInput: {
value: 'value', errors: []
},
secondInput: {
value: 'value', errors: []
}
}