Hi, I ran into a few problems while using scrollTrigger with vuejs and vue-router and can't figure it out, I hope to get some help here.
I made a small reproduction of the problem here https://codesandbox.io/s/vigilant-gould-do4go?file=/src/App.vue
I created a scrollTrigger for momentum scrolling based on Blake's pen here and it's all working perfectly. When clicking on router-link it transitions to another page with the scroll position back to the top of the page.
fyi - I'm using the following code to ensue the scroll position returns to the top after every route navigation
scrollBehavior (to, from, savedPosition) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve({ x: 0, y: 0 })
}, 5)
})
},
The problem starts when I add another scrollTrigger that does something else on the page. in this case, navigating to another route scrolls down the page to a saved position and when going back to the page with the second scrollTrigger, the start and end positions for the scrollTrigger are all wrong.
I tried killing and disabling the scrollTrigger on beforeDestroyed() hook using ScrollTrigger.getById("id").kill() but that didn't work.
Any help would be appreciated.
Thanks!