最近在做着的这个项目发现了一些bug,当用户点击浏览器的前进和撤退的时候,上一页数据保存了下来并没有刷新页面,这样会出现很多奇奇怪怪的bug,我只希望用户通过按钮来跳转,然后就需要禁止浏览器的前进和后退
1.main.js中,增加popstate监听
// 禁止浏览器前进后退 另一部本在router的index.js中
window.addEventListener('popstate', function() {
history.pushState(null, null, document.URL)
})
2.router的index.js中:
// 禁止浏览器 前进和后退,另一部分在main.js中
const router = new VueRouter({
mode: 'history',
routes,
scrollBehavior: () => {
history.pushState(null, null, document.URL)
}
})
我一开始是想着监听浏览器返回上一步的时候,刷新页面,但是思索直接把浏览器前进和后退直接禁用了就可以了,而且代码也会更好处理
参考连接:https://blog.csdn.net/weixin_42217154/article/details/109776249