提问人：Duy Tịnh 提问时间：10/17/2023 更新时间：10/18/2023 访问量：172
如何只在 React Hook 表单中提交数据更改
how to only submit data change in react hook form
问：
我正在使用“editData”函数发送 API 请求，并且我正在使用 React Hook Form。但是，当我提交表单时，React Hook Form 会发送所有字段。我只想发送已更改的字段。我怎样才能做到这一点？感谢您的帮助
答：
0赞
moshyfawn
10/18/2023
#1
RHF 维护表单状态，您可以将表单值与该状态进行比较，以筛选出未修改的字段。dirtyFields
有几种方法可以做到这一点，但这里有一种：
// Map RHF's dirtyFields over the `data` received by `handleSubmit` and return the changed subset of that data.
export function dirtyValues(dirtyFields: object | boolean, allValues: object): object {
// If *any* item in an array was modified, the entire array must be submitted, because there's no way to indicate
// "placeholders" for unchanged elements. `dirtyFields` is `true` for leaves.
if (dirtyFields === true || Array.isArray(dirtyFields))
return allValues;
// Here, we have an object
return Object.fromEntries(Object.keys(dirtyFields).map(key => [key, dirtyValues(dirtyFields[key], allValues[key])]));
}
这是相关 GitHub 讨论中可接受的答案，您可以在此处找到
上一个：如何进行跨组件表单检查
下一个：如何连接两个 zod 方案？
评论