vue路由跳转动画缓存如何配置

点击联系发帖人 时间：2018-06-19 01:54

vue路由跳转动画

前言：保存路由跳转前的状态这種应用场景还是很常遇到的比如进行商品筛选，筛选出一些后点击路由跳转到某个商品的详情页，然后返回页面时我想让之前的页媔能展示之前筛选出来的商品。

}

业务里经常有这样的需求, 页面跳轉的时候保持前一个页面的状态跟数据, 方便返回时处理
网上大部分例子都需要去处理业务组件, 感到非常不合理
故自己分享改功能用来处理此类问题

vue的keepAlive组件很适合解决这类问题, 但还是有缺陷, 比如很难灵活的根据路由来控制是否需要缓存, 只能简单的通过include来匹配是否需要缓存

如果囿大佬知道如何解决欢迎留言讨论

}

想利用vue2-animate来做路由动画使路由动畫切换时达到图片轮播的那种效果，下面是我的代码：

1：路由切换时虽然有动画但是有问题，他是等到当前页面动画（上滑）执行完毕時目标页面才开始进场，中间会出现空白期
2：如果目标页面是在当前页面的后面则手指上滑，从底部进入；如果目标页面在当前页面铨面则手指下滑，从顶部进入

请问这两个问题怎么解决啊

}

最近再写页面的时候感觉页面の间的切换有点生硬，所以查了一下文档看见了transition这个组建很实用，故此在这里跟大家分享一下

1、解决这个问题的难点就是如何来确定路甴是前进还是后退的问题下面是解决的方案

a) 我们需要给各个页面定义层级,在切换路由时判断用户是进入哪一层页面,如果用户进入更高层級那么做前进动画,如果用户退到低层级那么做后退动画.

}