antd-vue的date-picker限制不能选择今天之前的时间

我们在使用antd-vue的日期选择组件时,有时需要限制今天以前的日期不可选中,要怎么实现呢?

官方给出的参数,用 disabledDate 传入不可选择的日期
在这里插入图片描述在这里插入图片描述
前提确保安装了moment

npm i moment

废话不多说,直接上代码:

<a-date-picker
  :disabledDate="disabledDate"
>
a-date-picker>
methods: {
	moment,
}

methods 中 的disabledDate 根据以下情境选择,今天是2021.03.25

一、限制只能选明天及之后的日期(今天不可选中)
disabledDate (current) {
  return current && current < moment().endOf('day')
},

antd-vue的date-picker限制不能选择今天之前的时间_第1张图片

二、限制只能选今天及之后的日期(今天可选中)
disabledDate (current) {
  return current && current < moment().subtract(1, 'days').endOf('day')
},

antd-vue的date-picker限制不能选择今天之前的时间_第2张图片

三、限制只能选昨天及之前的日期(今天不可选中)
disabledDate (current) {
  return current && current > moment().subtract(1, 'days').endOf('day')
},

antd-vue的date-picker限制不能选择今天之前的时间_第3张图片

四、限制只能选今天及之前的日期(今天可选中)
disabledDate (current) {
  return current && current > moment().endOf('day')
},

antd-vue的date-picker限制不能选择今天之前的时间_第4张图片

你可能感兴趣的:(Ant,Design,of,Vue,Vue,vue)