1.限制结束时间必须大于开始时间
1） 在组件中添加 :picker-options="pickerOptionsEnd"
2） pickerOptionsEnd: any = {
disabledDate: (time: any) => {
if (this.form.startTime) { // 开始时间
return (
time.getTime() <
new Date(
this.form.startTime
).getTime()
);
}
}
};
2.限制开始日期必须小于结束时间或当前日期
1） 在组件中添加 :picker-options="pickerOptionsStart"
2） pickerOptionsStart: any = {
disabledDate: (time: any) => {
if (this.form.endTime) {
return (
time.getTime() > Date.now() - 8.64e6 ||
time.getTime() >
new Date(
this.form.endTime
).getTime() /*开始日期要在选择的结束日期之前 若结束日期大于当前日期 则开始日期为小于当前日期*/
);
}
}
}
3 选择日期范围 - 选择一个日期后 可选范围为已选日期前后30天，且不超过当前日期
1） 在组件中添加 :picker-options="pickerOptions"
2） pickerOptions = {
onPick: ({ maxDate,minDate}) => {
this.min = minDate && minDate.getTime(); //选择的小的日期 选择一个日期时的值
if(maxDate){ //如果两个日期都选择 该变量就有值
this.min=''
}
},
disabledDate:time=> {
let m = 30 * 24 * 60 * 60 * 1000;
if (this.min) {
return time.getTime() > (this.min+m)||time.getTime() < (this.min-m)||time.getTime() > Date.now();
} else {
return time.getTime() > Date.now();
}
}
