search

Vuepic / vue-datepicker

Datepicker component for Vue 3
https://vue3datepicker.com
MIT License
1.48k stars 147 forks source link

setMonthYear doesn't seem to do anything #745

Closed CasparWaara closed 8 months ago

CasparWaara commented 8 months ago

When I try to use the setMonthYear nothing happens.

I have setup it like this: <VueDatePicker v-model="dateRange" ref="daydatepicker" @update-month-year="handleMonthYear" range format="dd.MM" locale="fi" disable-month-year-select :month-change-on-scroll="false" :enable-time-picker="false" @update:model-value="dayChanged" />

and code that executes when I press button: monthChanged() { const month = 6; const year = 2024; this.$refs.daydatepicker.setMonthYear({ month, year }); },

Expected behavior month should change. But it doesn't. It's only displaying the current month (February). And the event update-month-year do not trigger.

What I'm doing wrong? it doesn't give any error. If I console log the ref it is there and I can see that there is setMonthYear method.

Desktop & mobile (please complete the following information):

Jasenkoo commented 8 months ago

The method works, however, if you are not in the inline mode, it will not work in your case, because when you open the menu, it will auto-correct the month. The way to bypass this is to provide onOutsideClick from the config prop and either do nothing, or check if the target el is a button and ignore the action

CasparWaara commented 8 months ago

The method works, however, if you are not in the inline mode, it will not work in your case, because when you open the menu, it will auto-correct the month. The way to bypass this is to provide onOutsideClick from the config prop and either do nothing, or check if the target el is a button and ignore the action

TypeError: _ctx.onOutsideClick is not a function

Did you mean onClickOutside ? Even with onClickOutside I didn't get it to work. Could you provide example code how it should be setup ? I'm not using ts or composition.

Thanks.

Jasenkoo commented 8 months ago

https://vue3datepicker.com/props/general-configuration/#config

CasparWaara commented 8 months ago

Problem still occurs when you don't have the calendar open when you change the month, even with the empty function. 1) change month by outside button or event or what ever (when calendar is closed) 2) click the input to open the calendar 3) calendar will change the month to current month even though I changed it on step 2 and I have the config prop (:config="{onClickOutside: () => {}}")

I tried to change the month on vue-datepickers @open event but it is emitted before the component changes the month. So If I change the month in open event it will be overrun by the component and set again to the current month.

Am I missing something or is it really this hard to programmatically set desired month?