//当点击这个li的时候 将currentActive转换为hotting 然后在样式中比较 为true的话就可以显示样式
<ul class="hotAndComing">
<li @click="currentActive='Hotting'"
:class="{'activeClass' : currentActive ==='Hotting'}">正在热映</li>
<li @click="currentActive='Coming'"
:class="{'activeClass' : currentActive ==='Coming'}">即将上映</li>
</ul>
//transition 被transition元素包裹的就可以使用过渡样式了
<transition mode="out-in"
enter-active-class="animated bounceIn"
leave-active-class="animated bounceOut">
//保存状态 然后就只在第一次切换的时候就才会发送请求 即使切换之后也可以保存下来
<keep-alive>
//component就可以显示组件 is就是要显示的组件 但是之前要引入组件 并且局部注册
<component :is="currentActive"></component>
</keep-alive>
</transition>
vue中tab栏的切换,保存状态,以及过渡
最新推荐文章于 2022-09-16 14:58:36 发布