element ui中的日期选择器指定时间段，其余时间禁选

日期选择器指定时间段，其余时间禁选

组件

<template>
  <div>
    <div class="block">
      <div class="block">
        <span class="demonstration">月</span>
        <el-date-picker
          v-model="value"
          type="month"
          placeholder="选择月"
          :picker-options="pickerOptions"
        ></el-date-picker>
      </div>
    </div>
  </div>
</template>

方法一

<script>
export default {
  data() {
    return {
      value: "",
      pickerOptions: {
        disabledDate: time => {
          var currentdate = ["2020-02", "2020-04"];
          return (
            time < new Date(currentdate[0]) || time > new Date(currentdate[1])
          );
        }
      }
    };
  }
};
</script>

</style>

方法二

<script>
  export default {
    data() {
      return {
        value:'',
        pickerOptions: {
          disabledDate: time => {
            var date = new Date()
            var year = date.getFullYear()
            var month = date.getMonth() + 1
            if (month >= 1 && month <= 9) {
              month = '0' + month
            }
            var currentdate = year.toString() + month.toString()
            var currentdate = ['202002','202004']
            var timeyear = time.getFullYear()
            var timemonth = time.getMonth() + 1
            if (timemonth >= 1 && timemonth <= 9) {
              timemonth = '0' + timemonth
            }
            var timedate = timeyear.toString() + timemonth.toString()
            return currentdate[0] > timedate ||  currentdate[2] < timedate
          }

        }
      };
    }