个根路由组件 (app 下的根路由组件, 须要滚动切换的作为其子组件)
在根路由组件增加鼠标滚动工夫监听, 在 mounted 中调用监听
当跳转到其余路由(跳出这个根路由时), 根路由组件会被销毁, 因而在根路由的 destroed 钩子函数中革除掉事件监听
Vue 路由切换过渡
vue 的过渡
应用 transition 包裹须要过渡的组件, 或者是一个 div, 或者是一个路由, 当这个创立或者销毁的时候, 会加载指定的动画成果, 这个动画成果须要本人指定, 这里指定的是 transitionName
而后在 data 外面申明这个, 然而这个值赋值为 ’ ‘, 因为须要依据路由向前或者向后对应不同的 name
当路由向前(这里是向下), 指定为 slide-down
而后定义 slide-down 的不同状态下的激活成果为过渡成果
随后定义进入开始动画
定义来到激活动画
上面是个别是固定
即申明 -enter-active, -leave-active 为过渡成果
随后写 -enter, -leave-active 具体须要的变动
个别就是一个 -enter, 一个 -leave-active
接着就是怎么判断路由向前还是向后
首先是怎么向前向后切换路由
接着是怎么判断是前还是后, 在写路由的时候, 写上 meta, 通过在 ” 根组件 ” 里监督路由变动时, 拿到路由信息, 比照这两个的大小来判断