mengxiong10 / vue2-datepicker

A datepicker / datetimepicker component for Vue2
https://mengxiong10.github.io/vue2-datepicker/index.html
MIT License
1.52k stars 407 forks source link

Disable dates in range #703

Closed Matt-Select closed 2 years ago

Matt-Select commented 2 years ago

Hello, I need to make a data range, but the max date the user can select must be the current date and the min date must be year - 100. I tried with disabledDates, but I can't find the right way to do.

Here is my current code:

<DatePicker 
    v-model="date" 
    range 
    format="D/MM/YYYY"
    range-separator=" - "
    :default-value="new Date()"
    :disabled-date="disabledDates"
    placeholder="Selecione as datas para filtrar"
></DatePicker>

export default {
    name: 'DateRange',
    components: { DatePicker },
    data() {
        return {
            date: [],
        }
    },
    methods:{
         disabledDates(date) {
            const today = new Date();
            const year = today.getFullYear();
            const minYear = year - 100;
            const minDate = new Date(minYear+',1,1');

            return date < minYear || today > new Date(today.getTime() - minDate.getTime());
        },
    }
};
mengxiong10 commented 2 years ago
            const today = new Date();
            today.setHours(0, 0, 0, 0)
            const year = today.getFullYear();
            const minYear = year - 100;
            const minDate = new Date(minYear, today.getMonth(),today.getDay());

            return date <minDate || date > today;

~https://github.com/mengxiong10/vue2-datepicker/issues/592#issuecomment-810985604~