我已经使用 MUI 和 React Hook Form 在 React 中构建了一个表单。我正在尝试创建一个用作Select Input的自定义TextField元素。我希望它是一个带有Ref道具的不受控制的组件。我试图按照 MUI 和 React Hook Form 文档的建议传递 inputRef 道具,但没有成功。
<TextField
id="id"
name="name"
select
native="true"
className={classes.textField}
label="label"
margin="normal"
variant="outlined"
inputRef={register({ required: "Choose one option" })}
error={!!errors.name}
>
<MenuItem value="">Choose one option</MenuItem>
<MenuItem value="3">03</MenuItem>
<MenuItem value="6">06</MenuItem>
<MenuItem value="9">09</MenuItem>
<MenuItem value="12">12</MenuItem>
<MenuItem value="16">16</MenuItem>
<MenuItem value="18">18</MenuItem>
</TextField>
Run Code Online (Sandbox Code Playgroud)
我发现的一件事是,如果我将本机select与ref 一起使用,它就可以正常工作。
此外,我尝试将inputRef道具更改为SelectProps道具,但它也不起作用。
先感谢您。