使用带有 react-hook-form 的 useFieldArray append 时出错（无法读取 null 的属性（读取 'focus'））

Question

当我尝试从 useFieldArray勾.

Codesandbox link.

点击“附加”按钮您将看到错误页面。请帮助我调查此问题或建议此代码的最佳实践。

PS。尝试将 line: 18 上的名称更改为 name: "test2"，然后再次单击“附加”，没有错误。

Answer 1

看起来你需要添加 onFocus 来取悦 react-hook-form 当它想要集中输入时。请参阅 RHF v7.

中 Controller here. Note that this prop was removed 的 onFocus 属性

<Controller
  render={({ ref, ...rest }) => (...)}
  name={name}
  onFocus={() => {
    const inputEl = document.querySelector(
      `input[name="${name}"]`
    );
    inputEl.focus();
  }}