ant-design-vue中a-date-picker 日期选择器校验不灵及禁止选择今天之前/之后的日期

ant-design-vue中a-date-picker 日期选择器校验不灵的问题

<a-form-model-item label="考试日期" prop="date" :rules="{required: true,message: '必填项',trigger: ['blur']}">
    <a-date-picker :disabled="disabled" class="w100" :disabledDate ="disabledDate" v-model="timeInfo.date" placeholder="考试日期"/>
</a-form-model-item>
复制

该字段虽然已经添加了数据，但是校验仍然显示必填。

原因是在选择校验的时候使用blur,若改为change，问题即可解决。

<a-form-model-item label="考试日期" prop="date" :rules="{required: true,message: '必填项',trigger: ['change']}">
    <a-date-picker :disabled="disabled" class="w100" :disabledDate ="disabledDate" v-model="timeInfo.date" placeholder="考试日期"/>
</a-form-model-item>
复制

ant日期选择（a-date-picker），限制不能选择今天之前或之后的日期

限制的参数是disabledDate

      <a-date-picker
        style="width: 200px"
        allowClear
        :disabledDate="disabledDate"
      />
复制

然后在methods中添加disableDate方法，当为小于号“<”时，功能是不能选择今天之前的日期。

disabledDate(current) {
   return current && current < this.$moment().endOf("day");
},
复制

效果如下：

当为大于号“>”时，功能是不能选择今天以后的日期

disabledDate(current) {
  return current && current > moment().endOf("day");
}
复制

效果如下：