vue router（路由）

• vue-router 入门安装
• 用 Vue + Vue Router 创建单页应用。将组件 (components) 映射到路由 (routes)，然后告诉 Vue Router 在哪里渲染它们。

• 动态路由
• 在 vue-router 的路由路径中使用动态路径参数。

• 嵌套路由
• 在路由中配置children ，嵌套的子路由

• 编程式的导航
• 通过 $router 访问路由实例。导航到不同的 URL的函数：router.push()、router.replace()、router.go()。

• 命名路由
• 在创建 Router 实例的时候，在 routes 配置中给某个路由设置名称。

• 命名视图
• 展示多个同级视图，而不是嵌套展示的时候，可以给每个 router-view 添加 name属性来命名。默认为 default。components 配置组件。

• 重定向和别名
• 在 routes 配置中，redirect 重定向。alias 定义别名。

• 路由组件传参
• 使用 props 将组件和路由解耦：取代与 $route 的耦合。

• 不同的历史记录模式
• history: createWebHashHistory() 开启 Hash 模式，history: createWebHistory() 开启 HTML5 模式

• 导航守卫
• 使用 router.beforeEach 注册全局前置守卫。用 router.beforeResolve 注册全局解析守卫。用 router.afterEach 注册全局后置钩子。用 beforeEnter 进入路由的守卫

• 路由元信息
• 定义路由的时候配置 meta 字段，并且它可以在路由地址和导航守卫上都被访问到。

• 过渡动效
• 用 transition 组件给路由添加过度效果。

• 数据获取
• 导航完成后，在组件的 created 钩子中 watch() 获取数据。在导航完成前，组件的 beforeRouteEnter()、beforeRouteUpdate() 守卫中获取数据。

• 滚动行为
• scrollBehavior() 方法实现期望滚动到哪个的位置

• 路由懒加载
• 异步组件仍然可以在路由组件中使用，但路由组件本身就是动态导入的。

• 导航故障
• 导航故障是一个Error 实例，附带了一些额外的属性。导航是异步的，我们需要 await router.push 返回的 Promise。要检查导航结果的性质，请使用 isNavigationFailure() 函数。检查重定向，使用 redirectedFrom 属性。

• 扩展 RouterLink
• RouterLink组件提供了足够的props来满足大多数基本应用程序的需求，但它并未尝试涵盖所有可能的用例

• Vue Router 和 组合式 API
• 组合式 API 中，获得路由实例 useRouter()，当前路由 useRoute()。更新组件路由钩子 onBeforeRouteUpdate()，离开组件路由钩子 onBeforeRouteLeave()

• Vue Router API
• Vue Router API