Static GitHub Issues

[34] Routes transitions javascript hooks

prev: Lazy loading
next: Please add the mapping params in nuxt.config.js (generate.routeParams).

Any way to add the javascript hooks to the <transition>?

<transition
  v-on:before-enter="beforeEnter"
  v-on:enter="enter"
  v-on:after-enter="afterEnter"
  v-on:enter-cancelled="enterCancelled"
  v-on:before-leave="beforeLeave"
  v-on:leave="leave"
  v-on:after-leave="afterLeave"
  v-on:leave-cancelled="leaveCancelled"
>
  <!-- ... -->
</transition>

Maybe we could simply add transition: { hooks: true } as a viable option in nuxt-config? And then add the same as above into <transition> (seems overkill to be able to name the hooks yourself).

Thing to watch out for though:

It’s also a good idea to explicitly add v-bind:css="false" for JavaScript-only transitions so that Vue can skip the CSS detection. This also prevents CSS rules from accidentally interfering with the transition.
<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This feature request is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c27">#c27</a>)</em></sub></div>