为什么所需的检查在日期选择器中不起作用？答案

【问题标题】：why required check is not working in date picker?为什么所需的检查在日期选择器中不起作用？
【发布时间】：2020-02-12 00:32:48
【问题描述】：

当我点击提交按钮时。它没有显示必填错误，因为它是必填字段。这是我的代码。我已经注册了 required 并且还尝试使用规则但仍然没有得到必需的验证

<MuiPickersUtilsProvider utils={DateFnsUtils}>
    <Controller
        as={
            <KeyboardDatePicker
                autoOk
                disableToolbar
                variant="inline"
                format="MM/dd/yyyy"
                id={"appointmentDate"}
                inputVariant="outlined"
                inputRef={register({ required: true })}
                label={"Appointment Date"}
                required={true}
                helperText={errors["appointmentDate"] && "Required..!!"}
                error={errors["appointmentDate"] ? true : false}
                KeyboardButtonProps={{
                    "aria-label": "change date"
                }}
            />
        }
        rules={{ validate: value => value === null || "Required ..!!" }}
        name={"appointmentDate"}
        control={control}
    />
</MuiPickersUtilsProvider>

https://codesandbox.io/s/mui-autocomplete-with-react-hook-form-1p3x5

【问题讨论】：

标签： javascript reactjs react-hooks react-hook-form

【解决方案1】：

这里是固定代码

        <Controller
          as={
            <KeyboardDatePicker
              autoOk
              disableToolbar
              variant="inline"
              format="MM/dd/yyyy"
              id={"appointmentDate"}
              //  inputRef={register({ required: true })}  // not required remove this
              inputVariant="outlined"
              label={"Appointment Date"}
              required={true}
              helperText={errors["appointmentDate"] && "Required..!!"}
              error={errors["appointmentDate"] ? true : false}
              KeyboardButtonProps={{
                "aria-label": "change date"
              }}
            />
          }
          // rules={{ validate: value => value === null || "Required ..!!" }} // change this like below
          rules={{ required: true }}
          name="appointmentDate"
          control={control}
        />

https://codesandbox.io/s/mui-autocomplete-with-react-hook-form-iymgr

【讨论】：