title: Transition in Vue.js is working incorrectly
body: <p>I want to animate <code>&lt;tr&gt;</code> when add it dynamically. But it adds  into the . Here's my code.</p>
  
  <pre><code>&lt;tbody&gt;   
      &lt;transition-group tag="tr" enter-active-class="animated fadeInUp"&gt;       
            &lt;tr v-for="(product, index) in products" v-bind:key="product"&gt;                     
              &lt;td&gt;{{ index + 1 }}&lt;/td&gt;
              &lt;td&gt;{{ product.name }}&lt;/td&gt;
              &lt;td&gt;{{ product.quantity }}&lt;/td&gt;
              &lt;td&gt;
                {{ product.price }}
                &lt;span class="glyphicon glyphicon-remove control-btn pull-right" @click="removeProduct(index)"&gt;&lt;/span&gt;
                &lt;span class="glyphicon glyphicon-pencil control-btn pull-right" @click="show(index)"&gt;&lt;/span&gt;
              &lt;/td&gt;                     
            &lt;/tr&gt;   
      &lt;/transition-group&gt;
      &lt;!-- Итого --&gt;           
      &lt;tr&gt;
        &lt;td&gt;&lt;/td&gt;
        &lt;td&gt;&lt;/td&gt;
        &lt;td&gt;&lt;/td&gt;
        &lt;td&gt;&lt;strong&gt;Итог:&lt;/strong&gt; {{ total }}&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/tbody&gt;
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/nk4Hl.png" rel="nofollow noreferrer">Screenshot of the DevTools</a></p>