element (PC端)
<el-date-picker
type="date"
placeholder="选择日期"
v-model="form.checkTime"
format="yyyy年MM月dd日"
value-format="yyyy-MM-dd"
:picker-options="pickerOptions"
></el-date-picker>
data() {
return {
// 完成时限(大于等于今天)
pickerOptions: {
disabledDate(time) {
return time.getTime() > Date.now() - 24 * 60 * 60 * 1000
}
}
}
}
type为month时使用picker-options属性限制
<el-date-picker
v-model="value2"
type="month"
:picker-options="startDatePicker"
placeholder="选择月"
value-format="yyyy-MM">
</el-date-picker>
data() {
return {
// 限制只能选择当前月以前两年的月份
value2: '',
startDatePicker: {
disabledDate: time => {
if (time.valueOf() > new Date().getTime()) return true
if (time.valueOf() < (new Date().getTime() - (31 * 24 * 3600 * 1000 * 24))) return true
}
},
}
}
vant (手机端)
<van-calendar
v-model="showCalendarEnd"
@confirm="onConfirmEnd"
:min-date="minDate"
:max-date="maxDate"
/>
data () {
return {
// 三年前的今天——三年后的今天
minDate: new Date(new Date().setFullYear(new Date().getFullYear() - 3)),
maxDate: new Date(new Date().setFullYear(new Date().getFullYear() + 3))
}
}