其实不须要抉择后提醒,能够做到完结工夫只能够在开始工夫后抉择,这样也不必思考去做简单的验证。
DatePicker 日期选择器:
设置属性 options
对象中的 disabledDate
能够设置不可抉择的日期。
disabledDate 是函数,参数为以后的日期,须要返回 Boolean 是否禁用这天。
以下为页面代码:
<DatePicker
type="date"
v-model="value.startTime"
:options="startOptions"
:placeholder="$t('p_select')+$t('effective_start_time')"
style="width: 220px"
>
</DatePicker>
<DatePicker
type="date"
v-model="value.endTime"
:options="endOptions"
:placeholder="$t('p_select')+$t('effective_end_time')"
style="width: 220px"
>
</DatePicker>
上面为data(){}外面代码
startOptions: {
disabledDate:(date) => {
let data = this.value.endTime == '' ? Date.now() : this.value.endTime;
return date >= data;
}
},
endOptions: {
// 指定终止日期
disabledDate: (date) => {
let data = this.value.startTime == '' ? '' : this.value.startTime;
return date < data;
}
},
这里官网文档为disabledDate(date){}
,咱们为了能够用this.value.startTime
this来指向,用箭头函数
发表回复