vue 如何针对性运用过渡效果

Question

说明：vue 中我有一个上传的大组件包含三个子组件。三个组件我通过三个布尔变量来设置显示和隐藏第一个组件默认是显示的(v-if)，剩余两个组件默认是隐藏的(v-if)。第一个组件包含一个上传按钮，用户点击上传按钮上传文件成功后，第一个组件会淡出消失。第二个组件会淡入显示，第三个组件依旧是隐藏的。第二个组件同理也包含一个继续按钮，点击后同样是第二个组件淡出隐藏，第三个组件会淡入显示。问题：目前我通过 transition-group 来写，但是只有淡出效果，没有淡入效果<template>  <transition-group tag="article" name="upload-fade" class="gaga-upload">    <upload-instructions key="instructions" v-if="showList.instructionsShow"></upload-instructions>    <upload-content key="content" :imgs="imgs" v-if="showList.contentShow" v-on:getNext="getDesign"></upload-content>    <upload-design key="design" v-if="showList.designShow"></upload-design>  </transition-group></template>

Answer 1

绑定name或者参考：动态过渡