element el-date-picker 年范围选择

 百度了好久没有找到年份的范围选择，没办法只能自己封装一个

使用环境，通过不同的筛选条件判断显示的时候年的范围选择

示例年份范围选择：

年

 实例代码:

          
           <el-date-picker
            v-model="yeartsStart"
            :picker-options="startDatePicker"
            value-format="yyyy"
            type="year"
            @change="startTime"
            placeholder="开始时间"
          >
          </el-date-picker>
          ~
          <el-date-picker
            v-model="yeartsEnd"
            value-format="yyyy"
            @change="startTime"
            :picker-options="endDatePicker"
            type="year"
            placeholder="结束时间"
          >
          </el-date-picker>

数据类型声明

data(){
  return{
      startDatePicker: this.beginDate(),
      endDatePicker: this.processDate(),   
      yeartsStart:'',
      yeartsEnd:''
    }
}

月和日使用的是element自带的，这里封装的是年的范围选择

methods: {

    // 选择年份范围选择时开始时间不能大于结束时间，结束时间不能小于开始时间

    // 提出开始时间必须小于提出结束时间
    beginDate() {
      let self = this
      return {
        disabledDate(time) {
          if (self.yeartsEnd !== '') {
            let fixedTime = new Date(time)
            return fixedTime.getFullYear() > self.yeartsEnd
          }
        }
      }
    },
    // 提出结束时间必须大于提出开始时间
    processDate() {
      let self = this
      return {
        disabledDate(time) {
          // let fixedTime = new Date(self.oldTime).getTime()
          // return time.getTime() < fixedTime
          let fixedTime = new Date(time)
          return fixedTime.getFullYear() < self.yeartsStart
        }
      }
    },
}