vue路由理解

目的是到达某个页面

1、书写方式

参考文档

2、路由模式

(1)、hash模式

通过onhashchange事件，可以在windows对象上监听这个事件，因为hash发生变化的url都会被浏览器记录下来，从而会发现浏览器的前进后退都可以用。

windows.onhashchange = function(event){
  console.log(event.oldURL,event.newURL);
let hash = location.hasg  //通过location对象来获取hash地址
console.log(hash)  // #/notebooks/123456/list  地址从#号开始
}

vue中基本不使用hash

(2)、history模式

典型表现：去除了URL中#。

使用方式：在路由实例化时添加 mode:'history'.

缺少服务端支持时，基于historyApi的路由无法从URL地址栏直接访问页面：因为url地址栏里输入后回车相当于发送了一次GET请求，那么不带#的路由路径就和普通的API接口是一样的，既然服务端并没有定义这样的接口，那直接访问时出现404页面就很正常了。

2、嵌套路由

解决页面局部切换 例如切换header中的某些按钮，改变main中部分