[Vuejs]-Nuxt child transitions not working in some cases

While I’m not entirely sure why this is happening, there are two ways you can solve this

• Using transition property in individual pages (Nuxt Docs)

/src/index.vue

export default {
  transition: {
    name: 'jade',
    mode: 'out-in'
  }
}

• Set pageTransition in nuxt.config.js, which will apply globally to all the transition components (Nuxt Docs)

/nuxt.config.js

export default {
  pageTransition: 'jade'
  // or
  pageTransition: {
    name: 'jade',
    mode: 'out-in'
  }
}

Here’s my Sandbox link using transition property