一. date-picker Template
<template>
<el-form-item label="开始时间" prop="startDate">
<el-date-picker
v-model.trim="form.startDate"
type="datetime"
placeholder="请选择日期"
value-format="yyyy-MM-dd HH:mm:ss"
:picker-options="startTime"
:disabled="isDetail"
></el-date-picker>
</el-form-item>
<el-form-item label="结束时间" prop="endDate">
<el-date-picker
v-model.trim="form.endDate"
type="datetime"
placeholder="请选择日期"
value-format="yyyy-MM-dd HH:mm:ss"
:picker-options="endTime"
:disabled="isDetail"
></el-date-picker>
</el-form-item>
</template>
二. script
<script>
export default {
data() {
return {
startTime: {
disabledDate: (time) => {
return this.disabledDateStart(time)
}
},
endTime: {
disabledDate: (time) => {
return this.disabledDateEnd(time)
}
}
}
},
methods: {
disabledDateStart (time) {
return (
time.getTime() > new Date(this.form.endDate).getTime()
);
},
disabledDateEnd (time) {
return (
time.getTime() < new Date(this.form.startDate).getTime()
);
}
}
}
</script>
文章来源地址https://www.toymoban.com/news/detail-682158.html
文章来源:https://www.toymoban.com/news/detail-682158.html
到了这里,关于el-date-picker设置开始时间小于结束时间的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!