Question

误解了react-hook形式。

我有一个用于编辑某些内容的表格。表单包含fieldArray。我使用默认值在useForm挂钩中设置了初始formData

const methods = useForm({ defaultValues: defaultValues });

defaultValues为

const defaultValues = {
  test: [
    {
      name: "useFieldArray1"
    },
    {
      name: "useFieldArray2"
    }
  ]
};

和fieldArray。在这里，我正在使用Controller（它是简化的案例-实际上，Custom input Controller更复杂）

 <ul>
    {fields.map((item, index) => {
          return (
            <li key={item.id}>
              <Controller 
                    name={`test[${index}].name`}
                    control={control}
                    render={({value, onChange}) => 
                    <input onChange={onChange} defaultValue={value} />}
              />
              <button type="button" onClick={() => remove(index)}>
                Delete
              </button>
            </li>
          );
        })}
</ul>

呈现表单时，一切都很好。默认值显示在输入字段中。但是，当我删除所有字段并单击追加时-新字段不为空...显示默认值再次。它仅在Controller上发生。为什么会发生？以及如何避免呢？

请，这是CodeSandBox链接。删除输入，然后按添加以重现我的意思。

https://codesandbox.io/s/react-hook-form-usefieldarray-nested-arrays-forked-7mzyw?file=/src/fieldArray.js

谢谢

在useFieldArray中将defaultValues设置为Controllers

0 个答案: