title: Veutify animating v-data-table
body: <blockquote>
  <pre><code>&lt;v-data-table         
      :headers="headers"
      :items="rows"
      :items-per-page="30"
       class="elevation-1"&gt;
  
            &lt;template slot="rows" slot-scope="props"&gt;
                &lt;td&gt;{{props.rows.username}}&lt;/td&gt;
                &lt;td&gt;{{props.rows.password}}&lt;/td&gt;
            &lt;/template&gt;
            &lt;template v-slot:item.view="{ item }"&gt;
                &lt;button v-on:click="viewUser(item.userId)" class="btn btn-outline-info"&gt;View Patient Data&lt;/button&gt;
            &lt;/template&gt;
            &lt;template slot="rows" slot-scope="props"&gt;
            &lt;td&gt;{{props.rows.email}}&lt;/td&gt;
            &lt;/template&gt;
    &lt;/v-data-table&gt;
  </code></pre>
  </blockquote>
  
  <p>How do I make it so every time a new row appears it fades in rather than "just appearing"?</p>
  
  <p>Thank you</p>