You can use the picker-options
attribute to set the minimum and maximum allowed dates for an el-date-picker
. Here's an example:
html
<template>
<el-date-picker
v-model="selectedDate"
:picker-options="pickerOptions"
type="date"
placeholder="Select date"
></el-date-picker>
</template>
<script>
export default {
data() {
return {
selectedDate: null,
pickerOptions: {
disabledDate(time) {
const minDate = new Date();
minDate.setHours(0, 0, 0, 0); // set minimum date to start of today
const maxDate = new Date();
maxDate.setDate(maxDate.getDate() + 7); // set maximum date to 7 days from today's date
return time.getTime() < minDate.getTime() || time.getTime() > maxDate.getTime();
}
}
};
}
};
</script>
In the example above, the pickerOptions
object is used to set a disabledDate
function which disables all dates before the start of today (minDate
) and after 7 days from today's date (maxDate
). You can adjust these values to fit your specific needs.