I am new to VueJS and I'm incorporating the vue-hotel-datepicker
library into my project.
Goal: change the minNights
data property depending on the month. I was able to simply override that value as described in the documentation.
Problem: minNights
should be 8 in August and July. When I use the Vue inspector, I can see that the HotelDatePicker
component (imported from the library) has an 'activeMonthIndex', so I believe I should use that. But how can I access this data property from my parent? How can I dynamically change the minNights
property based on the month?
My template:
<datepicker
:startDate="startDate"
@check-in-changed="setCheckInDate"
@check-out-changed="setCheckOutDate"
:maxNights="21"
:minNights="minNights" //dynamic based on month
:checkIn="checkIn"
:checkOut="checkOut"
:disabledDates="bookedDates"
:firstDayOfWeek="1"
:i18n="lang"
:showYear="true"
>
I have made a gist
for those who wish to see my code.
Any guidance is much appreciated.