VueJS управления datepicker: данных динамически меняться в зависимости от месяца

02.01.2019 10:44:20 Просмотров 153 Источник

Я новичок в VueJS, и я включаю vue-hotel-datepickerв свой проект.

Цель: изменить свойство minNightsdata в зависимости от месяца. Я смог просто переопределить это значение, как описано в документации .

Проблема: minNightsночи должны быть 8 в августе и июле. Когда я использую инспектор Vue, я вижу, что HotelDatePickerсвойство minNights на основе месяца?

Мой шаблон:

minNights

Я сделал <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" >для тех, кто хочет увидеть мой код. Любое руководство очень ценится.

У вопроса есть решение -

https://stackoverflow.com/questions/54012252/vuejs-datepicker-dynamically-change-data-based-on-month#comment94861515_54012252

пожалуйста, какой у вас конкретный вопрос?

Источник

https://stackoverflow.com/questions/54012252/vuejs-datepicker-dynamically-change-data-based-on-month#comment94861591_54012252

Я хочу изменить свойство minNights на основе месяца. Я отредактировал свой вопрос, чтобы быть яснее. Заранее спасибо

Источник

Ответы - VueJS управления datepicker: данных динамически меняться в зависимости от месяца / VueJS Datepicker: dynamically change data based on month

Является ответом!

Boussadjra Brahim

02.01.2019 11:05:55

Ваш minNightsprop должен быть привязан к computedсвойству, например :

<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"
>

скрипт :

  computed:{
        minNights(){

          let currentMonth=this.$children[0]._data.activeMonthIndex;
          if(currentMonth==6 || currentMonth==7){
             return currentMonth;
           }   
         }
     }

Источник

https://stackoverflow.com/questions/54012252/vuejs-datepicker-dynamically-change-data-based-on-month/54012501#comment94861915_54012501

Спасибо, но как мне установить minNights на определенный месяц? Единственное видимое свойство, с которым я могу работать, я думаю, это тот, который находится на моем втором скриншоте (activeMonthIndex, который генерируется библиотекой HotelDatepicker). Как я могу получить к нему доступ / есть ли лучший способ? Мне нужно связать месяц с моими ночами на песке.

Источник

https://stackoverflow.com/questions/54012252/vuejs-datepicker-dynamically-change-data-based-on-month/54012501#comment94862152_54012501

когда я проверяю code значение activeMonthIndex не испускается из этого компонента

Источник

https://stackoverflow.com/questions/54012252/vuejs-datepicker-dynamically-change-data-based-on-month/54012501#comment94862249_54012501

Тогда мне интересно, откуда берется это свойство. Я вижу его только тогда, когда нажимаю на компонент HotelDatePicker в инструментах Vue dev. Есть идеи, как я могу получить доступ к месяцу по-другому? Спасибо.

Источник

https://stackoverflow.com/questions/54012252/vuejs-datepicker-dynamically-change-data-based-on-month/54012501#comment94862293_54012501

таким образом, вы не могли, вы пытались получить месяц от newCheckIn?

Источник

https://stackoverflow.com/questions/54012252/vuejs-datepicker-dynamically-change-data-based-on-month/54012501#comment94862434_54012501

@Brahim, проблема в том, что мне нужно установить minNightsи нужен доступ к месяцу, прежде чем newCheckinинициализируется...

Источник

https://stackoverflow.com/questions/54012252/vuejs-datepicker-dynamically-change-data-based-on-month/54012501#comment94862491_54012501

Я знаю, но проблема в том, что мне нужно установить minNightsдо newCheckinбудет инициализирован... Поэтому мне нужно установить это свойство minNights, прежде чем пользователь начнет взаимодействовать с моим датапикером. Спасибо за вашу помощь, я надеюсь, что мы найдем решение.

Источник

https://stackoverflow.com/questions/54012252/vuejs-datepicker-dynamically-change-data-based-on-month/54012501#comment94862645_54012501

пожалуйста, объясните мне роль activeMonthIndex может быть, я предлагаю вам альтернативное решение

Источник

https://stackoverflow.com/questions/54012252/vuejs-datepicker-dynamically-change-data-based-on-month/54012501#comment94862750_54012501

activeMonthIndex дает мне 0, когда datepicker показывает представление января. Это дает мне 1, когда февраль появляется в поле зрения и т. д. Вы можете посмотреть, как он установлен в библиотеке github.com/krystalcampioni/vue-hotel-datepicker/blob/master/src/…

Источник