hash模式
hash模式背后的原理是onhashchange事件,可以在window对象上监听这个事件
使用 URL 的 hash 来模拟一个完整的 URL,于是当 URL 改变时,页面不会重新加载。
window.onhashchange = function(e){
console.log(e.oldURL, e.newURL);
let hash = location.hash.slice(1);
console.log(hash);//red
document.body.style.color = hash;
}
复制代码
history缺点:在hash模式下,前端路由修改的是#中的信息,而浏览器请求时是不带它玩的,所以没有问题.但是在history下,你可以自由的修改path,当刷新时,如果服务器中没有相应的响应或者资源,会分分钟刷出一个404来。这时需要进行一些配置(Vue官网有后端配置)
history模式
history.pushState API 来完成跳转而无须重新加载页面
history.go(-2);//后退两次
history.go(2);//前进两次
history.back(); //后退
hsitory.forward(); //前进
复制代码
© 版权声明
文章版权归作者所有,未经允许请勿转载。
THE END