title: Restart Vue transition
body: <p>I have defined a transition group in Vue</p>
  
  <pre><code>&lt;transition-group
          name="staggered-scale"
          tag="div"
          :css="false"
          @before-enter="animationBeforeEnter"
          @enter="animationEnter"
          appear&gt;
      &lt;span v-for="i in range" :key="i" :data-index="i"&gt;{{ i }}&lt;/span&gt;
  &lt;/transition-group&gt;
  </code></pre>
  
  <p>I have some Javascript hooks that control the animation.</p>
  
  <pre><code>animationBeforeEnter(el) {
    el.style.transform = 'scale(0.1)';
  }
  
  animationEnter(el, done) {
    const delay = el.dataset.index * 30;
    setTimeout(() =&gt; {
      el.style.transform = 'scale(1.0)';
      done();
    }, delay);
  }
  </code></pre>
  
  <p>When the component is initially rendered, the animation plays just fine. However, can I programmatically trigger the animation to run again?</p>