SOURCE

var count = 0;
var vm = new Vue({
  el:'#app',
  data:{
    type:true,
    com:'child',
    list:[],
   
  },
  methods:{
    handleClick(){
	this.list.push({
    title:'hello',
    id:++count
  })
    }
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.9/vue.js"></script>
<div id="app">
  <transition-group name="act">
  <div v-for="item of list" :key="item.id" >
    {{item.title}}
  </div>
  </transition-group>

  <button @click="handleClick">change</button>
</div>

.act-enter{
  opacity:0;
}
.act-enter-active{
  transition: opacity 3s;
}
.act-leave-to{
  opacity:0;
}
.act-leave-active{
  transition: opacity 3s;
}