history 路由原理

history模式

• 如果不希望看到丑陋的#可以使用history模式，其原理依赖于 history.pushState函数
• a标签点击以后，如果没有#必然会页面跳转发起请求
• 使用pushState函数可以改变url比如 /abc而不会发起请求
• js通过location.pathname获取该值 /abc做页面局部的替换

 

 

 

 

实现方式

history.pushState(url带的参数,标题,修改的路由) a标签获取herf属性的路由,增加点击事件，去除a标签的默认行为，使用该api进行调用 判断herf上路由，点击后加载组件

前进后退会触发该函数，也可以对前进后退进行操作

 

获取当前路由名称

let hash = window.location.hash; hashrouter名称
let path = window.location.pathname;