Reactjs 材料<；选择>；helperText不适用于react钩子窗体和yup

当需要字段时，我使用yup来显示错误/辅助文本。它非常适合文本输入，但是当我尝试使用带有yup错误消息的select时，它不会呈现我的自定义错误消息并将其打印到控制台：

Warning: React does not recognize the `helperText` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `helpertext` instead. If you accidentally passed it from a parent component, remove it from the DOM element.
in div (created by ForwardRef(InputBase))
in ForwardRef(InputBase) (created by WithStyles(ForwardRef(InputBase)))
in WithStyles(ForwardRef(InputBase)) (created by ForwardRef(OutlinedInput))
in ForwardRef(OutlinedInput) (created by WithStyles(ForwardRef(OutlinedInput)))
in WithStyles(ForwardRef(OutlinedInput)) (created by ForwardRef(Select))
in ForwardRef(Select) (created by WithStyles(ForwardRef(Select)))
in WithStyles(ForwardRef(Select)) (created by Employee)
in div (created by ForwardRef(FormControl))
in ForwardRef(FormControl) (created by WithStyles(ForwardRef(FormControl)))
in WithStyles(ForwardRef(FormControl)) (created by Employee)
in div (created by Employee)
in form (created by ValidatorForm)
in ValidatorForm (created by Employee)
in div (created by ForwardRef(CardContent))
in ForwardRef(CardContent) (created by WithStyles(ForwardRef(CardContent)))
in WithStyles(ForwardRef(CardContent)) (created by Employee)
in div (created by ForwardRef(Paper))
in ForwardRef(Paper) (created by WithStyles(ForwardRef(Paper)))
in WithStyles(ForwardRef(Paper)) (created by ForwardRef(Card))
in ForwardRef(Card) (created by WithStyles(ForwardRef(Card)))
in WithStyles(ForwardRef(Card)) (created by Employee)
in Employee (created by Index)
in ThemeProvider (created by Index)
in div (created by Index)
in Index (created by Context.Consumer)
in Route (created by App)
in Switch (created by App)
in Router (created by BrowserRouter)
in BrowserRouter (created by App)
in App

工作正常：

  <ValidatorForm onSubmit={handleSubmit(onSubmit)}>
        <div className="inputContainer">
          <TextField
            inputRef={register}
            id="outlined-basic"
            name="firstName"
            className="inputField"
            variant="outlined"
            label="First Name"
            error={!!errors.firstName}
            helperText={errors.firstName ? errors.firstName.message : ""}
          />
        </div>

              <FormControl variant="outlined" className={classes.formControl}>
            <InputLabel ref={inputLabel} >
              Location
            </InputLabel>
            <Select
              inputRef={register}
              value={location}
              labelWidth={labelWidth}
              error={!!errors.location}
              helperText={errors.location ? errors.location.message : ""}
            >
              {items.map(item => (
                <MenuItem key={item.value} value={item.value}>
                  {item.label}
                </MenuItem>
              ))}
            </Select>
          </FormControl>

无法正常工作：

  <ValidatorForm onSubmit={handleSubmit(onSubmit)}>
        <div className="inputContainer">
          <TextField
            inputRef={register}
            id="outlined-basic"
            name="firstName"
            className="inputField"
            variant="outlined"
            label="First Name"
            error={!!errors.firstName}
            helperText={errors.firstName ? errors.firstName.message : ""}
          />
        </div>

              <FormControl variant="outlined" className={classes.formControl}>
            <InputLabel ref={inputLabel} >
              Location
            </InputLabel>
            <Select
              inputRef={register}
              value={location}
              labelWidth={labelWidth}
              error={!!errors.location}
              helperText={errors.location ? errors.location.message : ""}
            >
              {items.map(item => (
                <MenuItem key={item.value} value={item.value}>
                  {item.label}
                </MenuItem>
              ))}
            </Select>
          </FormControl>

位置
{items.map（item=>(
{item.label}
))}

导入{InputLabel，FormHelperText，从“@material ui/core”中选择}；
从“@material ui/core”导入{FormControl，MenuItem，Button}”；
从“react hook form”导入{useForm，Controller}；
功能示例（道具）{
const{handleSubmit，errors，control，register}=useForm（）；
const name=“fieldName”；
const[value，setValue]=useState（null）；
常量句柄更改=（选定）=>{
设置值（选定的.target.value）；
};
const onSubmit=（data）=>{}；
返回(
{label | |“”}
(
{item.name}
))}
}
name={`${name}`}
规则={{required:“字段是必需的”}
control={control}
defaultValue={{value}
valueName={value}
variant=“filled”
onChange={（[选定]）=>{
handleChange（已选择）；
返回选中的；
}}
/>
字段是必需的
提交
);
}

const Helper=（{counter，maxLength，minLength，text}）=>{
常量类=useStyles（）
返回(
{text.length这是怎么回事：注意，我们有一个补丁来解决这个bug。