解决重复挂载问题

layouts/blank.vue

 <template>
-  <transition name="fade-transform" mode="out-in">
     <nuxt/>
-  </transition>
 </template>
 
 <script>

layouts/default.vue

 <template>
   <div class="bc-layout-container">
     <page-header></page-header>
-    <transition name="fade-transform" mode="out-in">
     <nuxt />
-    </transition>
     <page-footer></page-footer>
   </div>
 </template>

layouts/only-header.vue

 <template>
   <div class="bc-layout-container">
     <page-header></page-header>
-    <transition name="fade-transform" mode="out-in">
     <nuxt />
-    </transition>
   </div>
 </template>
 

nuxt.config.js

@@ -29,6 +29,14 @@ module.exports = {
   css: [
     '~/assets/font/iconfont.css'
   ],
+  pageTransition: {
+    name: 'fade',
+    mode: 'out-in'
+  },
+  layoutTransition: {
+    name: 'fade-transform',
+    mode: 'out-in'
+  },
   /*
   ** Plugins to load before mounting the App
   */