需求：el-date-picker只能選中當(dāng)前月期和當(dāng)前月期往前半年，其他時(shí)間就禁用了不讓選擇了，因?yàn)闆]數(shù)據(jù)哈哈。當(dāng)然也可以選擇往前一年等。

一、效果

?二、寫個(gè)日期選擇器

?:picker-options：日期選項(xiàng)

?value-format：選擇后的格式

?@change：事件改變后觸發(fā)的函數(shù)

<el-date-pickertype="months"v-model="monthTimeData"placeholder="選擇一個(gè)或多個(gè)日期":picker-options="pickerOptions"value-format="yyyyMM"@change="monthTime"></el-date-picker>

三、data的值

      monthTimeData: [], // 綁定的日期值currentDate: new Date(), // 當(dāng)前時(shí)間

四、computed

? ? ??this.currentDate.getMonth() - 4：注意！！！這個(gè)-4，就是當(dāng)前月往前可選的幾個(gè)月，

????????-6就是不算上當(dāng)前月往前可以選6個(gè)月，實(shí)在不懂可以自己測一下很簡單的~

@change時(shí)間就是個(gè)函數(shù)，值就是選擇后的值，這邊我就不寫了

  computed: {pickerOptions() {const startMonth = new Date(this.currentDate.getFullYear(),this.currentDate.getMonth() - 4);const endMonth = this.currentDate;return {disabledDate(time) {return time < startMonth || time > endMonth;},};},},

文章到此結(jié)束，希望對你有所幫助~