vue项目中transition标签

<transition>标签

自定义ransition 标签 

    <transition name="hg"></transition>

.hg-enter,
.hg-leave-to {
  transform: translateY(100%);
}

.hg-enter-active,
.hg-leave-active {
  transition: all 0.5s linear;
}

transition-group标签

 在实现列表过渡时，如果需要过渡的元素是通过v-for渲染出来的,需要使用 transition-group 

<transition-group>
    <li v-for="(item,i) in list" :key="item.id" @click="del(i)">
        {{ item.id }} --- {{ item.name }}
    </li>
</transition-group>