In my application, there is a component that displays information for different days as they are cycled through using the functions dayUp() and dayDown(). Here is an example of how these functions are structured:
dayUp() {
if (this.dayCount == 7) {
return;
}
this.dayCount++;
if (this.dayCount == 0) {
this.today = 'Today'
} else if (this.dayCount == 1) {
this.today = 'Tomorrow'
} else if (this.dayCount == -1) {
this.today = 'Yesterday'
} else {
this.today = '';
}
this.getSelectedDay(this.dayCount);
}
I have buttons set up to call these functions individually, and they successfully update the view with the new information. However, I am now trying to implement swipe functionality using HammerJS gestures. The swipes are being detected correctly in the correct directions, as confirmed by console logs. I have configured the swipe left gesture to trigger the dayDown() function and the swipe right gesture to trigger the dayUp() function. While the functions are being called properly during swiping, the view is not updating as expected. Strangely, the same functions work perfectly when triggered by the buttons. It's puzzling why the swipe gestures aren't producing the desired outcome. Below is the HammerJS code snippet:
const switcher = document.getElementById('switcher');
var mc = new hammer(switcher);
mc.on('swipeleft', () => {
console.log('left');
this.dayDown();
});
mc.on('swiperight', () => {
console.log('right');
this.dayUp();
});