当点击 下一个页面,是从右往中入场。
当点击 上一个页面,是从中到右离场。
可以给 router-view 设置,进场出场的过渡类名,来达到前进后退。
比如我们定义 prev,为上一页过渡。next,为下一页过渡。 css过渡
1 | /*下一页*/ |
过渡定义好了,接下来就是看准时机,改变类名就好了。
如何知道你现在是一页还是下一页。
额。。。 那就本地也来一个数组,里面放访问过的页面,然后在每次在路由的 router.beforeEach 里面,判断一下
要去的页面是之前的一个,那么说明就是后退,如果不是,那么说明就是前进。
1 |
|
以上就是 demo1 中转场的效果。
但是感觉转场的时候中间总是白了一段时间,以为在转场时只能存在一个。
后来看了 家有萌虎
的例子, 发现可以弄成类似原生的转场效果。
见demo2