title: Nuxt.js page transitions, @leave never executing
body: <p>I'm trying to have page transitions using with nuxt and Greensock (gsap), I can't seem to get it working. I don't want to animate page transitions using css only, because I want to easily chain animations on different elements.</p>
  
  <p>Previously, with Vue I could simply use:</p>
  
  <pre><code>&lt;transition @enter="enter" @leave="leave" appear mode="out-in"&gt;
    &lt;router-view /&gt;
  &lt;/transition&gt;
  
  export default {
    methods: {
      enter(el, done) {
        console.log('enter');
        // ... gsap animation code
      },
      leave(el, done) {
        console.log('leave');
        // ... gsap animation code
      }
    }
  }
  </code></pre>
  
  <p>Now, with Nuxt, I can't seem to get it working. I use the exact same code in <strong>layouts/default.vue</strong>. Except I replace <code>&lt;router-view/&gt;</code> with <code>&lt;nuxt/&gt;</code>.</p>
  
  <p>The "enter", "beforeEnter" methods works fine. It gets called on the initial page load, as well as anytime I change pages. <strong>However, the "leave" method never gets called.</strong></p>
  
  <p>What am I not understanding? I just need one place to manage all of my page transitions with javascript. I've been googling for a while now, looking through lots of examples, I can't seem to figure out what I'm doing wrong.</p>