avue 日期选择器禁止让用户选择当前日期:后的和当前日期前月

1.  
   //css
2.  
   /deep/.el-col.el-col-24.avue-form__menu.avue-form__menu--center {
3.  
   padding: 0px 10px 0;
4.  
   }
5.  
   /deep/.el-col.el-col-24.avue-form__menu.avue-form__menu--center{
6.  
   width: 30%;
7.  
   }

1.  
   <avue-form
2.  
   v-model="operateTimes"
3.  
   :option="options"
4.  
   @submit="handelTimeSubmit"
5.  
   @change="handelTimeChange"
6.  
   ></avue-form>
7.  
    
8.  
   //data
9.  
    
10.  
    operateTimes:'',
11.  
    options:{
12.  
    emptyBtn:false,
13.  
    column: [{
14.  
    label: "",
15.  
    clearable:false,
16.  
    prop: "date",
17.  
    type: "date",
18.  
    value:'', // 这是我获取的默认的显示日期，我这里是
19.  
    format: "yyyy-MM-dd",
20.  
    valueFormat: "yyyy-MM-dd",
21.  
    pickerOptions: {
22.  
    disabledDate(time) {
23.  
    return time.getTime() > Date.now() || time.getTime() < Date.now() - 1000 * 60 * 60 * 24 *30;//大于当前时间禁用 小于当前时间一个月禁止
24.  
    },
25.  
    }
26.  
    }]
27.  
    },
28.  
     
29.  
    //methods
30.  
    //初始化时间
31.  
    handelInit(){
32.  
    this.operateTimes = this.getDay(0);
33.  
    this.options.column[0].value = this.getDay(0);
34.  
    // this.optionTimeAll = [this.getDay(-30),this.getDay(0)];
35.  
    // this.optionTime.column[0].value = [this.getDay(-30),this.getDay(0)];
36.  
    },
37.  
    //时间
38.  
    getDay(day) {
39.  
    var today = new Date();
40.  
    var targetday_milliseconds = today.getTime() 1000 * 60 * 60 * 24 * day;
41.  
    today.setTime(targetday_milliseconds); //注意，这行是关键代码
42.  
    var tYear = today.getFullYear();
43.  
    var tMonth = today.getMonth();
44.  
    var tDate = today.getDate();
45.  
    tMonth = this.doHandleMonth(tMonth 1);
46.  
    tDate = this.doHandleMonth(tDate);
47.  
    return tYear "-" tMonth "-" tDate;
48.  
    },
49.  
    doHandleMonth(month) {
50.  
    var m = month;
51.  
    if (month.toString().length == 1) {
52.  
    m = "0" month;
53.  
    }
54.  
    return m;
55.  
    },
56.  
     
57.  
    //click time 获取当前时间
58.  
    handelTimeChange(time){
59.  
    this.operateTimes = time.date;
60.  
    },
61.  
    //搜索
62.  
    handelTimeSubmit(from,done){
63.  
    done()
64.  
    }
65.  
     

 <basic-container> </basic-container> //白色背景

这篇好文章是转载于：学新通技术网