みかづきメモ

プログラミング学習帳 ♪(✿╹ヮ╹)ノ

Vue でいっぱい transition したい

ページ遷移で transition して、ページ内コンテンツ切替で transition してってしたかった。

// App.vue
<template lang="pug">
  .container
    transition(name="router-transition" mode="out-in" leave-active-class="..." ...)
      router-view
</template>
// components/Page1.vue
<template lang="pug">
  .wrapper
    transition(name="content-transition" mode="out-in" ...)
      div(v-if="loading")
</template>

こんな感じで、vue-router つかって transition をネストさせる場合は、
間に1つ div とか挟んでおきましょうねというあれ。