vue 整个表单动画问题

Question

我想给表单一个动画 效果 。点击的时候慢慢淡入 但是 他错误必须要用vue transition-group 但是transition-group要求你绑定KEY 但是这个没需要循环输出的item 请输入代码 <transition name="fade1">

    <div class="box2" v-show="box2">
    <div class="box_til"><span class="acc_til">财务状况【收入状况】</span> <router-link to="" @click.native="hiddenBox(2)" class="close-dialog-modal fn-right">关闭窗口</router-link></div>
    <div class="p20 fn-clear">
        <form name="form" @submit.prevent="submit">
            <ul>
                <li>
                    <span>收入类型</span>
                     <el-select v-model="financial1.labUseType" placeholder="请选择" class="input"  style="width:290px;">
                        <el-option
                        v-for="item in labUseTypes"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                         style="width:290px;padding-left:10px;">
                        </el-option>
                     </el-select>
                     <span>*</span>
                </li>
                <li>
                    <span>收入名称</span>
                    <el-input v-model="financial1.labName" placeholder="请输入内容" class="input" ></el-input>
                    <span>*</span>
                </li>
                <li style="margin-left:18px;">
                    <span>收入金额</span>
                    <el-input v-model="financial1.labRemark" placeholder="请输入内容"class="input" @keyup.native="Replace(this.financial2.labRemark)"></el-input>
                    <span>元 *</span>
                </li>
                <li>
                    <div style="float:left;margin-left:90px;margin-top:10px;">其他说明</div>
                    <div style="float:left;margin-left:5px;">
                        <textarea v-model="financial1.textarea"></textarea>
                    </div>            
                </li>
            </ul>
            <input type="submit" value="确认提交" class="btn">
        </form>
    </div>
    </div>
    <div class="gd"></div>
</transition>

Answer 1

把你 transition里面所有的代码用一个div包裹就好了

<transition>
    <div>
        // div.box2
        // div.til
        ...
    </div>
</transition>

Answer 2

transition 只能包含一个子元素，<transition><div>your code</div></transition>