1.禁用选择器时间
<template>
<div id="app">
<el-date-picker
:picker-options="setDisabled"
>
</el-date-picker>
</div>
</template>
<script>
export default {
data() {
return {
setDisabled: {
disabledDate: (time) => {
return time.getTime() > Date.now(); // 可选历史天、可选当前天、不可选未来天
// return time.getTime() > Date.now() - 8.64e7; // 可选历史天、不可选当前天、不可选未来天
// return time.getTime() < Date.now() - 8.64e7; // 不可选历史天、可选当前天、可选未来天
// return time.getTime() < Date.now(); // 不可选历史天、不可选当前天、可选未来天
//return time.getTime() < this.continuedObj.disabledDate; this.$set(this.continuedObj,'disabledDate',new Date(row.endDate).getTime())
/*只能选择今天前的近七天*/
// let now = Date.now();
// let seven = 7 * 8.64e7;
// let sevenDays = now - seven;
// return time.getTime() > now || time.getTime() < sevenDays; //大于今天和小于七天前的禁用
},
},
};
},
};
/*
8.64e7 是科学计数法 8.64乘以10的7次方,即为86400000也就是 1000*60*60*24 也就是一天的毫秒数。
因为Date.now()方法能够返回得到自1970年1月1日00:00:00(UTC)到当前时间的毫秒数。咱们是北京时间
的时区,也就是为东8区,起点时间对应就是:"1970/01/01 08:00:00"
picker-options需要一个最终的布尔值,所以是否减去8.64e7也就是是否往前推移一天,也就是是否包
含当前的天数
*/
</script>
2.开始时间和结束时间相互约束,并且时间不可选未来
<template>
<div>
<el-date-picker
v-model="startDate"
:picker-options="startPickerOptions"
@change="handleStartDateChange"
></el-date-picker>
<el-date-picker
v-model="endDate"
:picker-options="endPickerOptions"
:disabled="!startDate"
@change="handleEndDateChange"
></el-date-picker>
</div>
</template>
<script>
export default {
data() {
return {
startDate: '',
endDate: '',
currentDateTime: new Date(),
startPickerOptions: {
disabledDate: (time) => {
return time.getTime() > Date.now()
}
},
endPickerOptions: {
disabledDate: (time) => {
return time.getTime() > Date.now() || time.getTime() < new Date(this.startDate).getTime()
}
}
}
},
methods: {
handleStartDateChange(val) {
this.endDate = ''
this.endPickerOptions = {
disabledDate: (time) => {
return time.getTime() > Date.now() || time.getTime() < new Date(val).getTime()
}
}
},
handleEndDateChange(val) {
this.startPickerOptions = {
disabledDate: (time) => {
return time.getTime() > new Date(val).getTime()
}
}
}
}
}
</script>