ZestfulNation / vue-hotel-datepicker

A VueJS v2 responsive date range picker. Displays the number of nights selected and allow several useful options like custom check-in/check-out rules, localization support and more.
https://zestfulnation.github.io/vue-hotel-datepicker/
MIT License
840 stars 220 forks source link

DisableDates not working #217

Closed akation closed 4 years ago

akation commented 4 years ago

Description

Hi, I have to disable more or less 200 dates from the calendar, I'm trying to use the disableDates prop/option but it is not working for me.

Code sample

<HotelDatePicker :starting-date-value="temporal_check_in" :ending-date-value="temporal_check_out" :disabledDates="disableDatesArray" :key="disableDatesArray.length" @check-in-changed="setCheckinDate" @check-out-changed="setCheckoutDate" />

Then in the created life cycle hook, I do something like this:

this.disableDatesArray = this.property.disabled_dates;

Here is an example of that this.disableDatesArray contains:

["2020-09-16", "2020-09-17", "2021-08-14", "2021-08-15", "2021-08-16", "2021-08-17", "2021-08-18", "2021-08-19", "2021-08-20", "2021-08-21", "2021-08-22", "2021-08-23", "2021-08-24", "2021-08-25", "2021-08-26", "2021-08-27", "2021-08-28", "2021-08-29", "2021-08-30", "2021-08-31", "2021-09-01", "2021-09-02", "2021-09-03", "2021-09-04", "2021-09-05", "2021-09-06", "2021-09-07", "2021-09-08", "2021-09-09", "2021-09-10", "2021-09-11", "2021-09-12", "2021-09-13", "2021-09-14", "2021-09-15", "2021-09-16", "2021-09-17", "2021-09-18", "2021-09-19", "2021-09-20", "2021-09-21", "2021-09-22", "2021-09-23", "2021-09-24", "2021-09-25", "2021-09-26", "2021-09-27", "2021-09-28", "2021-09-29", "2021-09-30", "2021-10-01", "2021-10-02", "2021-10-03", "2021-10-04", "2021-10-05", "2021-10-06", "2021-10-07", "2021-10-08", "2021-10-09", "2021-10-10", "2021-10-11", "2021-10-12", "2021-10-13", "2021-10-14", "2021-10-15", "2021-10-16", "2021-10-17", "2021-10-18", "2021-10-19", "2021-10-20", "2021-10-21", "2021-10-22", "2021-10-23", "2021-10-24", "2021-10-25", "2021-10-26", "2021-10-27", "2021-10-28", "2021-10-29", "2021-10-30", "2021-10-31", "2021-11-01", "2021-11-02", "2021-11-03", "2021-11-04", "2021-11-05", "2021-11-06", "2021-11-07", "2021-11-08", "2021-11-09", "2021-11-10", "2021-11-11", "2021-11-12", "2021-11-13", "2021-11-14", "2021-11-15", "2021-11-16", "2021-11-17", "2021-11-18", "2021-11-19", …]

It only disable like 2 dates, and i tried to test it manually and there's a bug if i pass 2020-09-16 it will disable 2020-09-15, if i pass 2020-09-17 it will disable 2020-09-16 and so...

Thanks beforehand.

akation commented 4 years ago

ISSUE UPDATE:

I think it is working, but there's a bug. It is disabling the day before the date I provided.

akation commented 4 years ago

UPDATE:

I just convert the string date to a moment object and it is working.