Call scrollBehavior with app context

[homerjam]

This allows us to listen for events in the scroll behavior hook, thus enabling us to resolve a promise returned by the hook upon triggering of some custom event (for example one emited on the $root by an after-leave transition event).

// in scrollBehavior
      this.$root.$once('triggerScroll', () => {
        resolve(position)
      })

// in component

  methods: {
    afterLeave () {
      this.$root.$emit('triggerScroll')
    }
  }

<!-- in template -->
      <transition name="fade" mode="out-in" @after-leave="afterLeave">
        <router-view class="view"></router-view>
      </transition>

Sorry for hastily done PR.

Ref: nuxt/nuxt#1376 (comment)

[homerjam]

Hey @yyx990803 any chance of squeezing this one in with the next patch release? 😃

[yyx990803]

Maybe passing the instance in as the 4th argument is better.

[homerjam]

I was wondering if app was the right context, I kind of followed nuxt conventions as that is how I've entered Vue land. Should I update the PR then?

If you don't mind me asking - what makes you think 4th arg is better?

Thanks!

[posva]

No other functions in vue-router have the context set to the root, and it's a function declared on the router options so it wouldn't be intuitive to have the context set to the app. I also think an extra argument makes more sense

[homerjam]

And should the extra argument be `app`? Bit of a Vue noob here so just making sure this is best.

…

On 15 Oct 2017 13:07, "Eduardo San Martin Morote" ***@***.***> wrote: No other functions in vue-router have the context set to the root, and it's a function declared on the router options so it wouldn't be intuitive to have the context set to the app. I also think an extra argument makes more sense — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#1804 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ABAcGWyiKWHZaR0_THH0CcUQf6DYqDM0ks5ssfWSgaJpZM4P3bJ9> .

[homerjam]

@posva @yyx990803 agreed that app doesn't make sense for the context, it should be router if anything.

Why is 4th argument better? I would expect the context to be set in router function/hooks etc. and it seems strange to pass router object to a function of itself.

[homerjam]

Happy to change this guys, just let me know.

[yyx990803]

this pointing to the router instance seems to make sense.

[zamakkat]

Thank you so much for this fix it's a life saver! The only thing that worked flawlessly with Vue transitions and vue-router to make silky smooth fades from 1 page to another.

This fix has been around for quite some time without being released, wondering if there are plans for a new release of vue-router soon? It was quite confusing because there was an example in the live documentation but it didn't work in code because the latest official release is 3.0.1 from Oct 14, 2017 (almost 10 months ago!). I am currently resorting to use a manual build against the dev branch...