search

mengxiong10 / vue2-datepicker

A datepicker / datetimepicker component for Vue2
https://mengxiong10.github.io/vue2-datepicker/index.html
MIT License
1.51k stars 405 forks source link

calendar-change event on CalendarPanel #668

Closed En-lia closed 2 years ago

En-lia commented 2 years ago

Hi

I'm using CalendarPanel component with one month.

I found a problem: when you click on calendar's gray days ('not-current-month') the month in the calendar changes, clicked day becomes start date, but the day my mouse is hovered on (after month change) is not highlighted until I move the mouse and trigger mouseover event.

Gif example: https://ibb.co/p13zZkx

I found a solution, line 119.
https://codesandbox.io/s/vue2-datepicker-0xih1?file=/src/App.vue But it's smells 🙂

I tried tying it to the 'calendar-change' event, but it doesn't work on CalendarPanel. Maybe you can suggest a better solution for my case?

Actually disabling clicks on "days not of the current month" would work for me too. Is there an easy way to do so?

mengxiong10 commented 2 years ago

You can use 'update:calendar' to replace 'calendar-change'. But I think the best way is to use calendar to control the display of the calendar. When the value is changed, you can change the calendar. image

You can read the source code calendar-panel.js, calendar-range.js for more detail