在elementUI中使用el-time-picker,如何只显示时分,并添加范围校验?
直接上代码
<el-time-picker
v-model="dataList.startTime"
format='HH:mm' 设置下拉框时间格式
value-format="HH:mm" 设置返回值时间格式
:picker-options="{
校验开始时间不得大于结束时间或最大时间值
selectableRange:`00:00:00 -${dataList.endTime ? dataList.endTime +':00' : '23:59:00'}`
}">
</el-time-picker>
结束时间限制
<el-time-picker
v-model="dataList.endTime"
format='HH:mm'
value-format="HH:mm"
:picker-options="{
设置结束时间不得早于开始时间或时间最小值
selectableRange:`${dataList.startTime ? dataList.startTime +':00' : '00:00:00'}-23:59:00`
}">
</el-time-picker>
总结:
format:设置下拉框时间列表格式;
value-format:设置返回值格式
picker-options:设置selectableRange实现选择范围的确定,此处动态设置需要拼接“秒”的值。
ps:分钟选择未出现禁止选择但是当选择小于开始时间的值时会重置至开始时间!