element 日期选择器 时间范围限制（开始-结束）

html部分

<el-form class="demo-form-inline" :model='searchConditions' ref="searchConditions" label-width="70px" label-position="left" @submit.native.prevent>
    <el-form-item label="时 间">
                  <el-date-picker
                    clearable
                    placeholder="开始时间"
                    v-model="searchConditions.startTime"
                    :picker-options="pickerOptionscreate"
                    size="small"
                    type="date">
                  </el-date-picker>
                  <div style="text-align: center;display:inline-block;">-</div>
                  <el-date-picker
                    clearable
                    placeholder="结束时间"
                    v-model="searchConditions.endTime"
                    :picker-options="pickerOptionsend"
                    size="small"
                    type="date">
                  </el-date-picker>
                </el-form-item>
</el-form>

js部分

export default {
  data () {
    let that = this
    return {
      pickerOptionscreate: {
        disabledDate (time) { // 开始时间的禁用
          if (that.searchConditions.endTime) {
            return time.getTime() > new Date(that.searchConditions.endTime).getTime()
          }
        }
      },
      // 结束时间
      pickerOptionsend: {
        disabledDate (time) { // 结束时间的禁用
          return time.getTime() < new Date(that.searchConditions.startTime).getTime()
        }
      }
}
}
}