vue-router

动态路由 动态路由的一般使用场景：后端返回一个路由表，前端通过接口拿到后处理。 主要使用的方法是router.addRoute(),只注册新的路由，也就是说，如果新增加的路由与当前位置相匹配，就需要你

滚动行为 当通过路由跳转切换到一个新的页面时，想要滚动到页面的顶部，或者保持原先的滚动位置，就像重新加载页面一样。vue-router可以自定义路由切换页面时如何滚动。 在创建一个router实例对象

路由过渡效果 如果你想要路由组件在切换的时候添加过渡动画的话，需要使用到router-view的插槽，像这样： 如果你想让每个路由的组件有不同的过渡，你可以路由元信息中添加过渡的动画样式的类名，动态绑

全局前置守卫 router.beforeEach 参数 说明 to 即将进入的目标路由对象； from 当前导航正要离开的路由对象； next() 在任何给定的导航守卫中都被严格调用一次， next(

路由元信息 通过路由记录中的meta属性可以定义路由的元信息，使用路由元信息可以在路由中附加自定义的数据。 例如可以添加一下自定义的数据： 权限校验标识 路由组件的过渡效果名称 路由组件持久化缓存（k

路由重定向（redirect） 当我们有一个嵌套路由，正常情况下，我们是需要点击子路由，才会渲染子路由对应的组件。如果我想这样，一进入到父路由组件页面在父路由页面中就渲染指定的子路由对应的组件，这时候

嵌套路由 嵌套路由就是父子关系或者是更深层次的爷孙关系... 嵌套路由的结构如下： 根据上图可以看出，每一个路由配置项都有一个children属性， 子路由配置项是在children属性中进行声明的，

路由传参 有些时候我们希望在跳转到另一个页面的时候，携带一些参数过去，比如商品介绍页跳转到商品详情页，希望将商品的id携带过去到商品详情页用来查询对应商品id的详情信息。 路由携带参数通常被称作路由传

历史记录 不保存历史记录 我们通过普通的方式进行路由跳转是会生成历史记录的，生成了历史记录就可以通过浏览器左上角的⬅和➡进行前进或后退，比如：<router-link to="/">、push等。 那

路由模式 vue2安装使用的是vue-router@3 vue3安装使用的是vue-router@4 vue-router@3和vuerouter@4的区别 vue-router@3 通过mode设置

安装 tip：在vue3项目中安装vue-router的时候，记得指定vue-router为4以上的版本。 在vue实例上注册vue-router 在src目录下创建router文件夹，在此文件夹下创