react-hook-form 和没有“name”属性的组件

问题描述

一个 React 项目中,我有一个表格,它呈现具有很多列的行,其中大部分包含 Fluent UI 控件。我可以使用 react-hook-form Controller 组件来处理大多数情况。问题是我使用的部分控件没有“名称属性(主要是下拉列表和人员选择器)。 React-hook-form 依赖于它。这是否意味着我不能在这个项目中使用它?

解决方法

您可以像使用 Controller 组件一样使用这些组件。

<Controller
  name="dropDown"
  control={control}
  render={({ field: { onChange,value } }) => (
    <Dropdown
      defaultSelectedKey={value?.key}
      onChange={(event,option) => onChange(option)}
      placeholder="Select an option"
      label="Dropdown"
      options={options}
    />
  )}
/>

Edit React Hook Form - Fluent UI