element日期选择器选择时间范围在一个月内

zhl_cafe_noir

于 2022-06-07 17:29:56 发布

阅读量363

点赞数

分类专栏：前端文章标签： elementui vue.js

本文链接：https://blog.csdn.net/zhl_cafe/article/details/125169791

版权

前端专栏收录该内容

31 篇文章 2 订阅

订阅专栏

template部分：

<el-date-picker
   type="daterange"
   unlink-panels
   value-format="yyyy-MM-dd"
   range-separator="至"
   start-placeholder="开始日期"
   end-placeholder="结束日期"
   :picker-options="pickerOptions">
</el-date-picker>

data部分：

data() {
  return {
    selectDate: '',
    pickerOptions: {
      onPick: ({maxDate, minDate}) => {
        this.selectDate= minDate.getTime();
        if (maxDate) {
          this.selectDate= ''
        }
      }, disabledDate: (time) => {
        if (this.selectDate!== '') {
          const one = 30 * 24 * 3600 * 1000;//一个月
          const minTime = this.selectDate- one;
          const maxTime = this.selectDate+ one;
          return time.getTime() < minTime || time.getTime() > maxTime
        }
      }
    }
  }
},