React hook 形式如何将值从自定义组件传递到已经分配给自己的控制器？

Question

我正在研究 react-hook-form 需要你们的帮助。我有自己的组件调用“输入”所以只想注册但是这个输入组件已经分配了“Onclick”和“值”道具所以如何获得 Onchange 和值来验证这个输入？

                          <Controller
                                    control={control}
                                    name="ProvinceInput"
                                    rules={{ required: true }}
                                    render={({ field: { onChange, onBlur, value, ref } }) => (
                                        <Input
                                            type="Province"
                                            onChange={setProvince}
                                            onSelect={onSelect}
                                            value={province}
                                            address={{
                                                province,
                                                amphoe,
                                                district,
                                                zipcode
                                            }}
                                        />
                                    )}
                                />
{errors.ProvinceInput && <span className='mt-2 text-sm text-red-400' >This field is required</span>}

我关注 React-hook-form 文档如您所见，该组件工作正常，但无法验证“ProvinceInput”寄存器。请帮助我，谢谢

Answer 1

你必须这样做：

<Controller
  control={control}
  name="ProvinceInput"
  rules={{ required: true }}
  render={({ field: { onChange, onBlur, value, ref } }) => (
    <Input
      type="Province"
      onChange={e => {
        setProvince(e);
        onChange(e);
      }}
      onSelect={onSelect}
      value={province}
      address={{
        province,
        amphoe,
        district,
        zipcode,
      }}
    />
  )}
/>;

React hook 形式如何将值从自定义组件传递到已经分配给自己的控制器？

React hook form how to pass value from custom component to controller with already assign own on change?

reactjs

react-hook-form