vue2 + el-date-picker限制时间选择范围
选择规定时间范围内的时间，即点击第一个时间的前后时间范围可选择，其余时间置灰不可选择
官网组件文档：https://element.eleme.cn/#/zh-CN/component/datetime-picker
限制时间选择范围的属性为：picker-options
html代码
<el-date-pickerv-model="dateTime"type="datetimerange"align="right"range-separator="- "start-placeholder="开始日期"end-placeholder="结束日期":picker-options="pickerOptions"@blur="isRestart = true"value-format="yyyy-MM-dd HH:mm:ss":clearable="dateClear"style="width:216px;">
</el-date-picker>js代码
data(return{// 第一次选择时间---重置时间范围isRestart: false,pickerMinDate: '',pickerOptions: {onPick: ({maxDate,minDate,}) => {this.isRestart = false;this.pickerMinDate = minDate.getTime();if (maxDate) {this.pickerMinDate = "";}},disabledDate: (time) => {if (this.pickerMinDate !== "") {// 时间范围为31天，可根据自身需求更改时间范围const one = 31 * 24 * 3600 * 1000;const minTime = this.pickerMinDate - one;const maxTime = this.pickerMinDate + one;return time.getTime() < minTime || time.getTime() > maxTime;}},},}
)
