ElementUIr日期选择器现在选择今天前，时间跨度小于30天

<template>

  <div class="block">

    <span class="demonstration">默认</span>

 <el-date-picker

      v-model="value1"

      :editable="false"

      :picker-options="pickerBeginDateAfter"

      @change="getQueryType"

      @focus="timeFocus"

      @blur="timeBlur"

      :default-value="timeDefaultShow"

      type="daterange"

      start-placeholder="开始日期"

      end-placeholder="结束日期"

      value-format="yyyy-MM-dd"

    >

    </el-date-picker>

  </div>

</template>

<script>

  export default {

   

    name: "time-demo",

    data() {

      let _vue = this;

      return {

        value1: '',

        timeOptionRange: null,  // 30天的参数控制

        timeDefaultShow: new Date().setMonth(new Date().getMonth() -1), // 设置默认显示界面

        pickerBeginDateAfter: {

          disabledDate(time) {

            let secondNum = 1000*60*60*24*30;

            // 今天以后将来的时间不可用，20180801之前的时间不可用，选中某个时间，它前30和后30天不可用，这里可以灵活配置

            return time.getTime() > Date.now() || time.getTime() < new Date('2018/08/01').getTime() || (_vue.timeOptionRange && (time.getTime() > _vue.timeOptionRange.getTime() + secondNum || time.getTime() < _vue.timeOptionRange.getTime() - secondNum))

          },

          onPick(time) {

            if (time.minDate && !time.maxDate) {

              _vue.timeOptionRange = time.minDate;

            }

            if(time.maxDate) {

              _vue.timeOptionRange = null;

            }

          }

        }

      }

    },

    methods: {

      getQueryType() {

 

      },

      timeFocus() {

 

      },

      timeBlur() {

 

      }

    }

  }

</script>

<style>

#app {

  font-family: Avenir, Helvetica, Arial, sans-serif;

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

  text-align: center;

  color: #2c3e50;

  margin-top: 60px;

}

</style>