一. date-picker Template
html
<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
javascript
<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>