近期项目由于要用到日、月、年可选范围控制在某年至昨天,开始用的是antd for vue的a-range-picker 经历一堆改造把mode为month、year时面板点击无法关闭问题解决后,发现当mode为month、year设置disableDate无效,测试antd 4.x的正常,而我这用的是antd for vue 1.x的不想升级到3.x(antd for vue 2.x也无效),又不想单独用两个分开的a-date-picker,从而转向使用elementUI的el-date-picker。
效果图
<el-date-picker
style="width:220px;"
v-model="value1"
size="mini"
type="daterange"
range-separator="-"
:picker-options="pickerOptions"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
<el-date-picker
style="width:220px;"
v-model="value1"
size="mini"
type="monthrange"
range-separator="-"
:picker-options="pickerOptions"
start-placeholder="开始月份"
end-placeholder="结束月份">
</el-date-picker>
<el-date-picker
style="width:220px;"
v-model="value1"
size="mini"
type="yearrange"
range-separator="-"
:picker-options="pickerOptions"
start-placeholder="开始年份"
end-placeholder="结束年份">
</el-date-picker>
value1: '',
value2: '',
value3: '',
pickerOptions: {
disabledDate (time) {
return time.getTime() <= new Date('2016-03-01').getTime() || time.getTime() > Date.now() - 8.64e6
}
},