vue.js - vue2.0使用animate.css做页面切换效果，切换时页面顶部会出现一段空白

问题描述

问 题

vue2.0使用animate.css做页面切换效果，切换时页面顶部会出现一段空白

在main.js中引用animate.css

import 'animate.css'

在App.vue中使用

<transition enter-active-class="animated fadeInRight" leave-active-class="animated fadeOutLeft">
  <router-view></router-view>
</transition>

解决方案

<transition mode="out-in">

基本上就能解决，不是出现空白，而是说切换的时候，之前的还没有消失，后来的就出现了（后来者居上）。使用过渡模式就能解决这个问题。

这篇关于vue.js - vue2.0使用animate.css做页面切换效果，切换时页面顶部会出现一段空白的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！