时间和日期选择器 type='datetime-local'

Question

我有两个文本字段 html 元素分别选择开始和结束日期/时间。 如何使开始日期/时间小于结束日期/时间？

<v-text-field
  id="setTime"
  outlined
  type="datetime-local"
  label="Start time"
  v-model="plan.start"
>
</v-text-field>

Answer 1

首先，如果没有开始日期/时间，则必须禁用结束日期/时间条件。 之后，当用户 select 开始日期/时间然后在验证检查结束日期/时间是否小于开始日期/时间返回错误时，您也可以在结束日期/时间字段中禁用小于开始日期/时间的天数（阅读您的日期/时间选择器库文档）

您可以使用 yup 验证日期时间或手动进行：

如果您的日期/时间是纪元格式，就像这样

const schema = yup.object({
  fromDate: yup.number().required(),
  toDate: yup.number().moreThan(yup.ref("fromDate")).required(),
});

希望对你有帮助