一、限制选择未来的日期时间、今日可选
- 代码如下
<DatePicker type="datetimerange" format="yyyy-MM-dd HH:mm:ss" :options="options" placeholder="操作时间" style="width:340px;" transfer v-model="formValidate.accepDate"
@on-change="changeAccepDate">
</DatePicker>
options: {
disabledDate (date) {
return date && date.valueOf() > Date.now();
}
}
-
2、效果如下
image.png
二、限制选择未来的日期时间、今日不可选
- 代码如下
<DatePicker type="datetimerange" format="yyyy-MM-dd HH:mm:ss" :options="options" placeholder="操作时间" style="width:340px;" transfer v-model="formValidate.accepDate"
@on-change="changeAccepDate">
</DatePicker>
options: {
disabledDate (date) {
// 减去今日的时间
return date && date.valueOf() > Date.now() - 86400000;
}
}
-
2、效果如下
image.png
三、未来月份不可选， 当月可选
- 代码如下
<DatePicker type="month" transfer placeholder="请选择月份" @on-change="changeExportMonth"
style="width:300px" :options="options" v-model="modalForm.exportMonth">
</DatePicker>
options: {
disabledDate (date) {
var dateNow = new Date();
return date && date.valueOf() > dateNow.setMonth(dateNow.getMonth());
}
}
-
2、效果如下：
image.png
