ElementUI的日期选择器对日期进行限制

一：需求

每月的1日-8日可录入上个月的数据，8之后只能录入当月的数据。
比如当前是9号，可选范围是当月的1号到当前的9号；
比如当前是5号，可选范围是上个月的1号到当前的5号；

二：条件

限制需求理清了，需要安装个时间处理的小插件 npm install dayjs --save

在需要的页面引入import dayjs from ‘dayjs’;

三：代码实现

限制需求理清了，需要安装个时间处理的小插件 npm install dayjs --save

在需要的页面引入import dayjs from ‘dayjs’;

<el-date-picker
    v-model="form.contentTime"
    type="date"
    :picker-options="pickerOptions"
    placeholder="请选择日期">
</el-date-picker>

pickerOptions: {
        disabledDate(v) {
          const date = Date.now(); //1970年1月1日截止到现在时刻的时间戳
          const curDate = v.getTime(); //当前选中的时间
          const curMonthStart = dayjs().startOf('month').unix(); //本月开始时间的时间戳
          const curMonthStartFor = new Date(dayjs().startOf('month').format('YYYY-MM-DD')); //本月开始格式化比如2021-07-01
          const curLimit = (curMonthStartFor.setDate(curMonthStartFor.getDate()+7))/1000; //当前限制的时间比如7月8号
          const curDay = dayjs().format('YYYY-MM-DD') //当前天 比如2021-07-15
          const curDayString = dayjs().unix() //当前时间戳
          const beforeMonth = that.getPreMonth(curDay);  //当前天的上个月
          const beforeStart = dayjs(beforeMonth).startOf('month').unix(); //当前天的上个月的一号
			
			//判断当前天是否大于8号
            if(curDayString>curLimit){
              return curDate >= date || curDate<curMonthStart*1000
             //当前选中的时间大于等于到截止到现在的时间 || 当前选中的时间小于本月一号
            }else{
              return curDate >= date || curDate<beforeStart*1000
              //当前选中的时间大于等于到截止到现在的时间 || 当前选中的时间小于上月一号
            }
        },
      },

method :{
	 /**
    * 获取上一个月
    *
    * @date 格式为yyyy-mm-dd的日期，如：2021-07-15
    */
    getPreMonth(date) {
      let arr = date.split('-');
      let year = arr[0]; //获取当前日期的年份
      let month = arr[1]; //获取当前日期的月份
      let day = arr[2]; //获取当前日期的日
      let days = new Date(year, month, 0);
      days = days.getDate(); //获取当前日期中月的天数
      let year2 = year;
      let month2 = parseInt(month) - 1;
      if (month2 == 0) {
        year2 = parseInt(year2) - 1;
        month2 = 12;
      }
      let day2 = day;
      let days2 = new Date(year2, month2, 0);
      days2 = days2.getDate();
      if (day2 > days2) {
        day2 = days2;
      }
      if (month2 < 10) {
        month2 = '0' + month2;
      }
      let t2 = year2 + '-' + month2 + '-' + day2;
      return t2;
    }
}