选择开始日期之后，结束日期在开始日期之前禁用
默认
@change="change"
v-model="value1"
type="date"
placeholder="选择日期">
默认
v-model="value2"
type="date"
@focus="focus"
:picker-options="pickerOptions1"
placeholder="选择日期">
export default {
data () {
return {
value1: '',//开始日期
value2: '',//结束日期
pickerOptions1:{}//结束日期配置
}
},
methods: {
change() {
console.log(this.value1);
},
focus(time) {
let aa = new Date(this.value1).getTime()
this.pickerOptions1 = {
disabledDate(time) {
return time.getTime() < aa
},
}
},
disabledDate(time) {
return time.getTime() > new Date(value1).getTime()
},
},
created () {
}
}
效果
时间选择器.png
开始日期
v-model="startTime"
type="date"
value-format="yyyy-MM-dd"
format="yyyy-MM-dd"
:picker-options="pickerOptionsStart"
placeholder="选择日期">
结束日期
v-model="endTime"
type="date"
value-format="yyyy-MM-dd"
format="yyyy-MM-dd"
:picker-options="pickerOptionsEnd"
placeholder="选择日期">
export default {
data () {
return {
startTime: '',//开始日期
endTime: '',//结束日期
pickerOptionsStart:{
disabledDate:(time) => {
let state
if (this.endTime!=="") {
state = time.getTime() > Date.now() || time.getTime() > new Date(this.endTime).getTime()
}else {
state = time.getTime() > Date.now()
}
return state
},
},//开始日期配置
pickerOptionsEnd:{
disabledDate:(time)=> {
return time.getTime() < new Date(this.startTime).getTime()-86400000 || time.getTime() > Date.now()
// return time.getTime() > Date.now()
},
},//结束日期配置
}
},
methods: {
},
created () {
}
}
613
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
