vue跳路由的时候，页面从右向做进入的动效果，怎么实现呢？

Posted 2023-04-23

参考技术A 用vue自带的transition可以实现。
transition组件可以定义自己的动画方法，也可以通过css3进行设置。具体用法可以查看官方文档。

vue路由守卫

参考技术A 所谓路由守卫就是页面跳转时触发的钩子函数，我们称之为路由守卫，vue一共给我们提供了三种路由守卫，分别是全局路由守卫，组件内路由守卫，路由独享守卫，路由独享守卫是写在路由中的，这三种路由守卫都会有beforeEach，beforeResolve，afterEach三个钩子函数，分别表示跳转前，进入的时候，进入路由后触发的钩子函数，这三个钩子函数都有一个回调函数，里面有三个参数，分别为to，from，next分别表示将要进入的路由，离开之前的路由，下一个要进入的路由。

在项目中我们一般使用路由来实现页面的鉴权，比如，当用户登陆之后，我们可以把后台返回的token或者用户的一些信息存入本地存储或vuex中，当用户跳转页面时，我们会在路由中判断本地是否存有token，如果有token则使用next方法让用户跳转到相应的页面，没有则使用next方法让用户返回到登录页