最近一直做ant-design-vue项目，总结下DatePicker 日期选择框

主要应用禁用部分时间，比如今天以后的，或者今天以前的。
显示年月日和时分秒

一、 第一种单天时间选择

1、限制只能选明天及之后的日期（今天不可选中）

	disabledDate (current) {
	  return current && current < moment().endOf('day')
	}

2、限制只能选今天及之后的日期（今天可选中）

	disabledDate (current) {
	  return current && current < moment().subtract(1, 'days').endOf('day')
	}

3、限制只能选昨天及之前的日期（今天不可选中）

	disabledDate (current) {
	  return current && current > moment().subtract(1, 'days').endOf('day')
	}

4、限制只能选今天及之前的日期（今天可选中）

	disabledDate (current) {
	  return current && current > moment().endOf('day')
	}

5、案例：

		 <a-date-picker
            style="width:242px;"
            v-model:value="values"
            @change="dateChange" 
            :disabled-date="disabledDate"
            :show-time="defaultValue"
          />
          
	  values:'',  //时间
      disabledDate:'',   //禁用今天以前时间
      defaultValue:'',    //展示时间
import moment from 'moment';   //引入moment


created(){
    //禁用日期   
    this.disabledDate = (current) => {
        // console.log(current);
        // console.log(moment().endOf('day'));
      // Can select days before today and today
      return current && current < moment().endOf('day');
    };
  },

//change事件后，选择把数值转换成相应的格式
	dateChange(val){
      	console.log(val)
        this.values=moment(val).format('YYYY-MM-DD HH:mm')
      	console.log(this.values)
    },

二、 多天时间段选择 （ 周 和 月）

//只能选择今天之前的   时间段（几号到几号）
<a-range-picker :disabled-date="disabledDate" v-if="where.useStatus==1" @change="onChange1" v-model:value="value3" />
                  
<a-week-picker :disabled-date="disabledDate" style="width:100%;" v-if="where.useStatus==2" @change="onChange2" v-model:value="value4" placeholder="请选择周"/>  

<a-month-picker  style="width:100%;" v-if="where.useStatus==3" @change="onChanges" v-model:value="value2"  placeholder="请选择月份"/>

disabledDate:'',   //禁用今天以后时间
value3:[],  //按日


import moment from 'moment'

async created() {
     //初始昨天   (需要加参数)
    const day = new Date();
    const day2=day.getTime() - 24 * 60 * 60 * 1000;
    const day1=new Date(day2);
    const s1 = day1.getFullYear() + "-" + (day1.getMonth() + 1) + "-" + day1.getDate();
    this.times=s1;
    this.where.beginTime=s1;
    this.where.endTime=s1;

    //禁用日期
    this.disabledDate = (current) => {
        // console.log(current);
        // console.log(moment().endOf('day'));
      // Can select days before today and today
      return current && current > moment().startOf('day');
    };
 }，

方法
//日粒度
    onChange1(date,dateString) {
      console.log(date,dateString);
      // console.log(dateString);
        if(dateString){
            this.where.beginTime=dateString[0];  //当日开始时间
            this.where.endTime=dateString[1]; //当日结束时间
        }
        if(dateString[0]==''){
            this.where.beginTime=this.times;
            this.where.endTime=this.times;
            this.value3[0]=this.times;
            this.value3[1]=this.times;
        }
      // console.log(this.times);
      // console.log(this.where);

    },
    //周粒度
    onChange2(weekData) {
    //   const startDate = moment(weekData).day(1).format('YYYY/MM/DD (dddd)'); // 周一日期
        if(weekData){
            const startDate = moment(weekData).day(1).format('YYYY/MM/DD'); // 周一日期
            const endDate = moment(weekData).day(7).format('YYYY/MM/DD'); // 周日日期
            let start=startDate.split('/')[0]+'-'+startDate.split('/')[1]+'-'+startDate.split('/')[2];
            let end=endDate.split('/')[0]+'-'+endDate.split('/')[1]+'-'+endDate.split('/')[2];
            this.where.beginTime=start;  //当周开始时间
            this.where.endTime=end; //当周结束时间
            // this.value4=start+'-'+end;
        }
        if(weekData[0]==''){
            this.where.beginTime=this.times;
            this.where.endTime=this.times;
        }
     
    },
    //月粒度
    onChanges( data,monthData) {
    
    //   console.log(data,monthData);
      console.log(data);
    //   console.log(monthData);
  
     
        let y=monthData.split('-')[0];  //年
        let m=monthData.split('-')[1];  //月

        let lastDateOfMonth = new Date(y, m, 0).getDate(); // 当月最后一天
        if(monthData){
            this.where.beginTime=monthData+'-'+'01';  //当月开始时间
            this.where.endTime=monthData+'-'+lastDateOfMonth; //当月结束时间

        }
        if(monthData[0]==''){
            this.where.beginTime=this.times;
            this.where.endTime=this.times
        }
        
    },