javascript - 使用react-hook-form的Controller组件不允许自定义Antd Select显示标签

Question

我正在使用Antd Select 组件来构建自定义组件，它使我能够返回对象而不是原始值，并在选择下拉选项中显示对象项中的嵌套值，它工作正常，并且可以使用 react-hook-form 进行验证。 :

<Form.Item ... >
  <SpringSelect style={{ width: "200px" }} options={departments} placeholder="Department 2"
            name="department2"  onChange={e => {setValue("department2", e);}}/>

</Form.Item>

这也适用于 Controller但是它不会在选择输入中显示标签:

<Controller as={<SpringSelect style={{ width: "200px" }} />}
            placeholder="Department 1" name="department1" options={departments}
            onChange={([e]) => {return { value: e };}} control={control}      />

有关更多详细信息，请检查codesandbox Playground 中的整个代码

Answer 1

我认为问题是由于您的 SprintSelect innerProps

看看下面我的 CSB:

https://codesandbox.io/s/suspicious-platform-tlr55

<Select onChange={props.onChange}>