使用element-ui日期选择器

• 选择开始日期之后，结束日期在开始日期之前禁用

<template>
  <div>
    <div class="block">
    <span class="demonstration">默认</span>
    <el-date-picker
    @change="change"
      v-model="value1"
      type="date"
      placeholder="选择日期">
    </el-date-picker>
  </div>
    <div class="block">
    <span class="demonstration">默认</span>
    <el-date-picker
      v-model="value2"
      type="date"
      @focus="focus"
       :picker-options="pickerOptions1"
      placeholder="选择日期">
    </el-date-picker>
  </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      value1: '',//开始日期
      value2: '',//结束日期
       pickerOptions1:{}//结束日期配置
    }
  },
methods: {
  change() {
    console.log(this.value1);
  },
  focus(time) {
    let aa = new Date(this.value1).getTime()
   this.pickerOptions1 = {
      disabledDate(time) {
            return time.getTime() < aa
          },
   }
  },
   disabledDate(time) {
            return time.getTime() > new Date(value1).getTime()
          },
},
  created () {
  }
}
</script>

<style lang='scss'>

</style>

效果

时间选择器.png