js修改hash的方法
关键:
window.onhashchange = (event) => {
// do something
}
hash变化包括
- js修改hash
- 手动修改url的hash
- 浏览器前进、后退
js修改hash:
location.href = "#user";
在vue-router等路由组件中如何实现history模式呢?
关键函数:history.pushState
docment.getElementById('btn1').addEventListener('click', function() {
const state = {.name: 'page1' };
console.log('切换路由到page1');
history.pushState(state, '', 'page1');
})
// 监听浏览器前进、后退
window..onpopstate = (event) => {
console.log('onpopstate', event.state, location.pathname);
}
注意,history模式需要注意需要后端配合!如果不做浏览器兼容性处理,在history模式下切换了路由,此时再刷新,会模式去找page1这个页面,导致找不到该页面。所以我们需要在服务器配置返回index.html,路由由history.pushState触发。
原文地址:https://blog.csdn.net/huyijian1314/article/details/140574342
免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!