quasar-ui-qcalendar icon indicating copy to clipboard operation
quasar-ui-qcalendar copied to clipboard

<Script setup> impossible to switch between dates

Open JohnyDyxt opened this issue 1 year ago • 5 comments

Hello team,

I can't reproduce it on codepen so i will try to be as clear as possible.

I'm under Vue 3.2 with composition api

When i click on a button, i see in the console that something happen but nothing really happen on the calendar.

Below my code :

code console

JohnyDyxt avatar Jul 11 '22 12:07 JohnyDyxt

Doesn't it has to be

calendar.value.prev()

same with next() and moveToToday() ?

Bruno17 avatar Jul 12 '22 06:07 Bruno17

Hi and thank you for your answer,

If i add () at the end, the behavior is exactly the same. Nothing happened. If i console.log it , the console will display UNDEFINED.

If i console.log(calendar.value.prev) => I see the function but nothing happened.

JohnyDyxt avatar Jul 13 '22 05:07 JohnyDyxt

I have the same issue. Nothing happens.

      <q-calendar-month animated transition-next="flip-left" ref="calendar" :weekdays="[1, 2, 3, 4, 5]">
const calendar = ref(null);

const onNext = () => {
  calendar.value.next();
};

adgower avatar Sep 05 '22 04:09 adgower

I believe I found the solution, and I may have missed it in the documentation, but in order for the prev/next to work you need to set a v-model for the calendar with a date selected:

v-model="selectedDate"

import { today } from "@quasar/quasar-ui-qcalendar/src/index.js"

const selectedDate = ref(today())

You don't need to import today, but you need to set selectedDate as a valid formatted date according to docs, and then the prev next works.

adgower avatar Sep 05 '22 14:09 adgower

Shouldn't this issue be closed?

aasen avatar Apr 27 '24 13:04 aasen