基于element-ui 日期选择器el-date-picker， 即对日期做区间限制

需求：

有时候需求会让我们对日期选择器做限制，即控制最多可跨越多少个月份，其中涉及到不同年份该如何计算。

HTML：

<el-date-picker
   v-model="timePeriod"
   type="monthrange"
   value-format="yyyyMM"
   format="yyyyMM"
   range-separator="至"
   start-placeholder="开始月份"
   end-placeholder="结束月份"
>
</el-date-picker>

功能代码：

this.timePeriod = ['201402','201409'] //演示数据
      let stagingList = []
      if(this.timePeriod && this.timePeriod.length >0){
          let time = new Date().getFullYear().toString()
          let lists = []

          let yearComparison_1 = this.timePeriod[0].substr(0,time.length)
          let yearComparison_2 = this.timePeriod[1].substr(0,time.length)

          let compareTheMonthsTo_1 = this.timePeriod[0].substr(time.length,2)
          let compareTheMonthsTo_2 = this.timePeriod[1].substr(time.length,2)
          let monthlyDifference = compareTheMonthsTo_2 - compareTheMonthsTo_1

          if (yearComparison_1 == yearComparison_2) {
              if(monthlyDifference == 0){
                  let deduplication = []
                  for (let k = 0; k < this.timePeriod.length; k++) {
                    if (deduplication.indexOf(this.timePeriod[k]) === -1) {
                      deduplication.push(this.timePeriod[k])
                    }
                  }
                  lists = deduplication
              } else if(monthlyDifference > 0){
                  let incrementalStorage = []
                  for (let j = 0; j < monthlyDifference + 1; j++){
                    let moon = (compareTheMonthsTo_1 * 1)  + j
                    if(moon < 10){
                      moon = "0" + moon;
                    }
                    incrementalStorage.push(yearComparison_1 + moon)
                  }
                  lists = incrementalStorage
              }
          }else if(yearComparison_1 != yearComparison_2){
              let length_1 = 12 -compareTheMonthsTo_1
              let storingData1 = []
              let length_2 = compareTheMonthsTo_2 * 1
              let storingData2 = []
              let storingData3 = []
              for (let i = 0; i < length_1 + 1; i++) {
                let moon_1 = (compareTheMonthsTo_1 * 1)  + i
                if(moon_1 < 10){
                  moon_1 = "0" + moon_1;
                }
                storingData1.push(yearComparison_1 + moon_1)
              }

              let th = yearComparison_2 - yearComparison_1
              if(th > 1){
                  var newYearSEve = []
                  let N = yearComparison_1
                  for (let index = 1; index < th; index++) {
                    N = (N * 1) + index
                    for (let q = 1; q < 13; q++) {
                      if(q < 10){
                        q = "0" + q;
                      }
                      newYearSEve.push(N.toString() + q)
                    }
                  }
                  storingData1.push(...newYearSEve);
              }

              for (let j = 0; j < length_2; j++) {
                let moon_2 = j + 1
                if(moon_2 < 10){
                  moon_2 = "0" + moon_2;
                }
                storingData2.push(yearComparison_2 + moon_2)
              }
              storingData3 = storingData1.concat(storingData2)
              lists = storingData3  
          }
          stagingList = lists
      }

      if (stagingList.length > 13) {
          this.$message.warning('账期至多只可选择13个月！')
          return
      }

打印结果：

console.log(stagingList);