[ScrollTrigger and Vue-router issue (start and stop bug)]

Vue's built-in component transition? I didn't use it.
Nuxt was discovered when I searched these questions.

[ScrollTrigger and Vue-router issue (start and stop bug)]

Thank you for your reply.
When I searched before, I also saw that a wrapper should be added outside the element, so I .Banner has been added .pin-container.I didn't expect to add the first element in the template. Thank you very much for your correction.
However, there is still a problem that existed before. When switching to the about page and then switching back to the home page, page scrolling will cause page exceptions.
I added 

ScrollTrigger.refresh()

 in the activated of each page.

It's solved, but I don't know if it's a good way

 

[ScrollTrigger and Vue-router issue (start and stop bug)]

15 hours ago, OSUblake said:

 

That doesn't sound like a good approach, reloading the page. Can you make a minimal demo on CodeSandbox that shows the issue? Thanks!

 

Thank you for your reply

minimal demo is here：https://codesandbox.io/s/minimal-demo-forked-t7psos?file=/src/App.vue

The location of the footer that jumps from the home page to the about page will not change because the home page pin is set to true

This demo is a little bad because I haven't used codesanbox before

[ScrollTrigger and Vue-router issue (start and stop bug)]

I also have a similar problem. I use Vue router to jump the page. The size of the pin spacer box on the first page will be retained to the second page. This may be due to single page application. I don't know.

I tried @Rodrigo's method:

On 4/15/2021 at 5:20 AM, Rodrigo said:

beforeDestroy() {
    this.t.kill();
  },

,but failed
My solution is:

deactivated() {
    location.reload()
  }

But I think there may be disadvantages. If there is a better way, please reply to me