为什么当日期选择器不为空且具有值时，我会在日期选择器上收到“需要”验证错误？

如何解决为什么当日期选择器不为空且具有值时，我会在日期选择器上收到“需要”验证错误？

我使用@material-ui/pickers、react-hook-form 和 yup 进行验证。

我总是收到验证错误，表明该字段是必需的，即使我填写了它并用日期填充它并且日期正确注册。我只希望在用户未选择任何日期时弹出错误。

这是代码和框：

https://codesandbox.io/s/suspicious-snow-r5teh

验证在另一个字段上按预期工作，所以我认为我的代码中没有任何错误？

const formSchema = yup.object().shape({
  country: yup.string().required(),age: yup.date().required()
});

  const [selectedDate,handleDateChange] = useState<Date | null | undefined>(
    null
  );
        <Controller
          render={({ field }) => (
            <DatePicker
              {...field}
              inputvariant="outlined"
              disableFuture
              fullWidth
              openTo="year"
              format="ddd/MM/YYYY"
              error={!!errors.age}
              helperText={errors.age?.message}
              views={["year","month","date"]}
              value={selectedDate}
              onChange={(newValue) => handleDateChange(newValue?.toDate())}
            />
          )}
          name="age"
          control={control}
        />