charliekassel / vuejs-datepicker

A simple Vue.js datepicker component. Supports disabling of dates, inline mode, translations
MIT License
2.61k stars 732 forks source link

unable to catch 'showCalendar' event #744

Open KennethMurugu opened 5 years ago

KennethMurugu commented 5 years ago

When clicking the input field, I can see in Vue.js dev tools that a showCalendarevent is emitted by I am unable to catch it.

<Datepicker
            class="mb-5 datepicker"
            format="dd/MM/yyyy"
            name="submit_date"
            id="submit_date"
            :calendar-button="true"
            calendar-button-icon="fas fa-calendar datepicker_icon"
            input-class="ml-3 datepicker_input"
            calendar-class="datepicker_calendar"
            placeholder="Enter the date"
            v-on:showCalendar="datepickerOpened">
</Datepicker>

image

The datepickerOpened method is never called.

As a side note, I can see that the event is emitted by the DateInput component and not the DatePicker component so maybe that has something to do with it...? Or my code is just bad :D I'm still kinda new to Vue.. Either way any help is appreciated. Cheers

cjmyles commented 5 years ago

Looks like the Datepicker component does not emit the @opened event as expected. I can see from the src/components/Datepicker.vue component that the close method has the following code:

this.$emit('closed')

However, there is no opened equivalent as per the documentation. The showCalendar event is triggered by the Dateinput.vue component and handled by the Datepicker.vue component which should in turn trigger opened.