关于AntDesignVue的DatePicker日期选择框组件开始、结束时间日期限制的方法

关于AntDesignVue的DatePicker日期选择框组件开始、结束时间日期限制的方法

关于AntDesignVue的DatePicker日期选择框组件开始、结束时间做日期选择限制，

        <a-row>
          <a-col :span="12">
            <a-form-item label="开始日期">
              <a-date-picker
                v-model:value="dateStart"
                placeholder="请您选择一个开始日期"
                style="width: 100%"
                :disabledDate="disabledDateStart"
              />
            a-form-item>
          a-col>
          
          <a-col :span="12">
            <a-form-item label="结束日期">
              <a-date-picker
                v-model:value="dateEnd"
                placeholder="请您选择一个结束日期"
                style="width: 100%"
                :disabledDate="disabledDateEnd"
              />
            a-form-item>
          a-col>
        a-row>

1. 引入moment

import moment from 'moment';

3. 开始时间区间可选范围：当前时间和结束时间之前；

function disabledDateStart(current) {
    if (dateEnd) {
      return current > moment(dateEnd).endOf('day');
    } else {
      return current && current > moment().endOf('day');
    }
  }

2. 结束时间区间可选范围：在当前时间之前，开始时间及开始时间之后；

function disabledDateEnd(current) {
    if (dateStart) {
      return (
        (current &&
          current < moment(dateStart).subtract(1, 'days').endOf('day')) ||
        (current && current > moment().endOf('day'))
      );
    } else {
      return current && current > moment().endOf('day');
    }
  }