vue-cal
vue-cal copied to clipboard
Swipe on Mobile
This is an amazingly rich component, so credit and kudos where it's due. I was wondering, for smartphone users, Is there a way to enable swiping to move forwards and backwards through the weeks? If not, is this something that could be in the roadmap?
I've managed to achieve swipe capability using vue2-touch-events but would be nice if I could get the same functionality built in
how did you achieved this? Would you mind sharing a basic example?
@fratzinger I wrapped vue-cal with vue2-touch-events
<span v-touch:swipe="swipeHandler">Vue Cal in here</span>
Then you can define a method that handles the swipe, and methods to move forward and backward by a week (in our case):
swipeHandler(evt) {
if (evt === 'left') this.skipWeek(true);
if (evt === 'right') this.skipWeek(false);
},
skipWeek(forward) {
this.calSelectedDate = add(this.calSelectedDate, {
weeks: forward ? 1 : -1,
});
},
add() is a date-fns function.
That was easy 😄 Thanks for your quick answer!
That was easy 😄 Thanks for your quick answer!
No worries - glad you have a solution