react-hook-form - 反应钩子形式+材料ui：日期选择器没有得到初始日期

Question

我并使用 React 钩子形式。我有以下日期选择器控制器。

          <MuiPickersUtilsProvider utils={DateFnsUtils}>
            <Controller
              name="dateOfBirth"
              control={control}
              render={({ field: { ref, ...rest } }) => (
                <KeyboardDatePicker
                  ref={ref}
                  margin="dense"
                  fullWidth
                  id="date-picker-dialog"
                  label="Date picker dialog"
                  format="MM/dd/yyyy"
                  KeyboardButtonProps={{
                    "aria-label": "change date",
                  }}
                  {...rest}
                />
              )}
            />
          </MuiPickersUtilsProvider>

现在，当我在不更改日期的情况下提交时，它根本不会显示dateOfBirth在提交数据中。

但是当我更改日期时，dateOfBirth会显示在提交数据中

标签： react-hook-form

Answer 1

发生这种情况是因为您没有设置defaultValue. 使用<Controller />时需要提供文档defaultValue中的, ：

您需要defaultValue在字段级别提供或useForm使用defaultValues.

另一件小事：您应该将 传递ref给inputRef您的，<KeyboardDatePicker />以便 RHF 可以将其链接到实际的输入元素。