transition-group的问题

来源:9-2 排行页排行榜数据应用

wykun

2017-12-11

<transition-group tag="ul" name="toggle" mode="out-in">
<li v-for="(tabContent,index) in tabsContent" :key="index" class="tab-content-item"
          v-show="currentIndex === index">
<ul>
<li v-for="(content,index2) in tabContent" :key="index2"
              class="tab-content-item-content">
<span class="time">{{content.time}}</span>
<span class="name">{{content.name}}</span>
<span class="server">{{content.server}}</span>
</li>
</ul>
</li>
</transition-group>

老师.我在用transition的时候,vue它推荐我使用transition-group,但是使用了transition-group以后,它的mode和transition是不一样的,不能够像transition一样可以mode="out-in".我查了官方文档,这块也没有怎么解释如何去写,请老师解答一下

写回答

1回答

ustbhuangyi

2017-12-11

https://cn.vuejs.org/v2/guide/transitions.html#列表过渡
看上去只提到了单个元素是可以支持 out-in mode 的,你试试用 v-move 来实现。

0
1
wykun
非常感谢!
2017-12-12
共1条回复

Vue2.0高级应用教学实战,开发企业级移动端音乐Web App

Vue.js高级知识应用大集合,实战企业级APP,教你搞定组件化开发。

5432 学习 · 3805 问题

查看课程