从react-select组件以react-hook形式获取值？

userNick

我正在尝试在使用react-select创建的表单中使用组件react-hook-form。我已经按照这里的react-hook-form网站的说明进行操作，但是当我提交表单时，来自select组件的值是""（默认值）。

我知道该表单在一般情况下可以正常工作，因为其他输入值可以ref={register}正常工作。我正在使用的只是这个值Controller。我在Select组件中缺少道具还是在其他地方出错？

我有一个父组件，其中定义了表单：

<Form id="public-share-form" onSubmit={handleSubmit(onSubmit)}>
   <Controller
    as={<PublicShareNetworkSelect />}
    name="network"
    control={control}
    defaultValue=""
   />
</Form>

那么对于一个子组件react-select中使用组件as的道具Controller：

return (
   <Select
   closeMenuOnSelect={true}
   options={networks}
   noOptionsMessage={() => "No matching options"}
   defaultValue=""
   className="basic-single"
   classNamePrefix="select"
/>
);

塔吉·哈瓦里（Taghi Khavari）

我认为您需要Select像这样直接使用：

<Controller
  as={
    <Select
      closeMenuOnSelect={true}
      options={networks}
      noOptionsMessage={() => "No matching options"}
      defaultValue=""
      className="basic-single"
      classNamePrefix="select"
    />
  }
  name="network"
  control={control}
  defaultValue=""
/>

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。