如何在 react-hook-form 版本 7 中重置 setValues？

Question

我已经从 api 中形成了一些预填充值，我将它们设置为 setValues('input-field-name','value-got-from-api') 并且当我使用 react-hook-form 的重置方法时，它会重置新添加的数据，但不会重置字段中的全部数据。例如。如果先前使用 setValue 的输入字段值为 123，并且如果我键入 123abc，它会重置 abc 部分并将字段设置为 12345。但我想重置为空或空白形式。

直接的问题是，如何使用纯 js 或使用 react-hook-form 重置表单字段？

PS：我尝试了 reset() 来自 rect-hook-form 的方法和普通 js 重置 document.getElementById('myform').reset(); 但注意工作。

Answer 1

您可以使用从 useForm 钩子返回的 reset 方法。

export default function App() {
  const { register, handleSubmit, reset } = useForm();
  const onSubmit = (data, e) => {};

  return (
    <form onSubmit={handleSubmit(onSubmit)}>
      <input {...register("firstName", { required: true })} />
      <input {...register("lastName")} />
      <input type="button" onClick={() => {
        reset({
          firstName: "default value",
        }, {
          keepErrors: true, 
          keepDirty: true,
          keepIsSubmitted: false,
          keepTouched: false,
          keepIsValid: false,
          keepSubmitCount: false,
        });
      }} />
    </form>
  );
}

如何在 react-hook-form 版本 7 中重置 setValues？

How to reset setValues in react-hook-form version 7?

javascript

forms

reactjs

react-hook-form