Nuxt.js 에서 동적 route시 트랜지션 안되는 문제 해결

사용하고 있는 Layout 의 파일에서 아래와 같이 수정한다.

<template>
  <nuxt :nuxtChildKey="routerViewKey"/>
</template>

<script>
export default {
  computed: {
    routerViewKey () {
      // If current route has children
      if (this.$route.matched.length > 1) {
        return compile(this.$route.matched[0].path)(this.$route.params)
      }
      return this.$route.fullPath.split('?')[0].split('#')[0]
    }
  },
}
</script>

간단히 설명하자면, 동적 route를 사용하더라도 nuxt-child 에 key를 부여하여 트랜지션이 작동하도록 하는것이다.

참조 : https://github.com/nuxt/nuxt.js/issues/1651#issuecomment-340193233