vue项目中利用popstate处理页面返回 *** 作

vue项目中利用popstate处理页面返回 *** 作,第1张

vue项目中利用popstate处理页面返回 *** 作

需求背景:项目中需要做一个返回确认,避免用户误触返回键而退出当前页面。


原理:利用history和浏览器刷新popstate状态

实现:

1、在mounted() 阶段判断并添加popstate事件监听,History.pushState()(参数:一个状态对象,一个标题(现在被忽略了),以及一个可选的URL地址), 注意:IOS版的微信,是会立即触发popstate事件,所以需要pageshow做下处理,(当一条会话历史记录被执行的时候将会触发页面显示(pageshow)事件。


(这包括了后退/前进按钮 *** 作,同时也会在onload 事件触发后初始化页面时触发))

2、在methods里定义监听 *** 作函数

3、页面销毁时,取消监听。


(注意:一定要取消监听,否则其他vue路由页面也会被监听)

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/589133.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-04-12
下一篇 2022-04-12

发表评论

登录后才能评论

评论列表(0条)

保存