VUE路由（router）

跳转页面

安装指定版本3.0.3
新建router.js文件。
在main导入router.js

base：process.env.BASE_URL获取目录路径 vue.config.js里的默认路径
路由文件pages。
/后面的文件名就是path
路由跳转方式：
1，a标签
2，router-link （to:到哪里去 tag:可以将router-link渲染成某个标签）

子路由的切换：用replace

路由嵌套
children:[子路由]
在主组件使用router-view

路由的优化：
1，路由懒加载：
为了要给客户更好的客户体验，首屏组件加载速度更快一些，解决白屏问题。
定义：延迟加载，按需加载。
方式：vue异步组件和ES中的import。


路由守卫
最常用的全局守卫：beforEach。放在main.js里
用于登录时的验证
参数：
to:去哪
from：从哪
next:下一个

独享守卫：
在router.js里的

组件内守卫：

Update：应用场景，购物车里的待付款，待评价。。。（主子路由）
异步问题用setTimeout(()=>{

},100);
解决方案：vue,react都可以用
创建空页面skip。

beforeRouteLeave:导航离开时
解决方法1，2，页面离开执行：（首选）

router.beforeEach((to, from, next) => {
    document.body.scrollTop = 0
    // firefox
    document.documentElement.scrollTop = 0
    // safari
    window.pageYOffset = 0
    next()
  })