element中DateTimePicker 日期时间选择器组件日期范围如何限制为1天

目前项目中有一个需求，要求选择时间的时候日期限制为1天。如下图所示

这是怎么实现的呢？
1、引入element中的DateTimePicker组件
type是你想显示的类型
change方法会在日期改变时调用
picker-options才是我们处理时间的重点

<el-form-item :label="getLanguageUrl.InventoryTaskTime||'库存同步时间'" class="active">
            <el-date-picker class="daterange" size="mini" v-model="taskTime" type="datetimerange" range-separator="至" start-placeholder="开始时间" 
            							end-placeholder="结束时间" @change="payTimeChange" :picker-options="pickerOptions"></el-date-picker>
 </el-form-item>

pickerOptions实在data中定义好的，组件内部会按照下面的代码规则对日期进行处理

//定义pickerOptions对象，这个对象中可以设置  onPick  disabledDate
      taskTime: null,
      pickerOptions: {
        onPick: (time) => {
          // //此处的time为选择日期时的结果，time为一个对象，有两个值，一个是maxDate,一个是minDate,详细见下图，
          // //以下判断是只选择了一个值的时候，也就是默认的开始值。
          //当第一时间选中才设置禁用
          if (time.minDate && !time.maxDate) {
            this.queryParams.taskStart = time.minDate
          }
          if (time.maxDate) {
            this.queryParams.taskStart = ''
          }
        },
        disabledDate: (time) => {
          let timeOptionRange= this.queryParams.taskStart
          let secondNum = 60 * 60 * 24 * 1 * 1000
          if (timeOptionRange) {
            return time.getTime() > timeOptionRange.getTime() + secondNum || time.getTime() < timeOptionRange.getTime() - secondNum
          }
        },
      },

接下来就写完啦，希望能给你们带来帮助