ios微信浏览器打开的h5网页不支持pagehide?-灵析社区

CTang

如题,有个h5网页(使用uniapp+vue2编写)挂载在微信公众号上的,有个需求是当离开网页时保存用户填写的信息,其中的离开包括返回按钮,关闭浏览器按钮,如下图所示: ![image.png](https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250103/867c2319dd512d76eae01185f7a9fedd.png) 其中最上方的关闭按钮我在ios手机上监听不到,安卓都是支持的,关键代码如下: mounted() { this.source = appSource() console.log('this.source', this.source) if (this.source === 'ios') { window.addEventListener('pagehide', this.recordHandler) } else { window.addEventListener('visibilitychange', this.recordHandler) } this.getList() this.getPriceModelList() this.getProjectAddrList() }, // 监听页面卸载 onUnload() { if (this.source === 'ios') { window.removeEventListener('pagehide', this.recordHandler) } else { window.removeEventListener('visibilitychange', this.recordHandler) } }, 我在网上查了资料,ios是支持pagehide事件的:([https://developer.apple.com/library/archive/documentation/App...](https://link.segmentfault.com/?enc=JNq6NMB5lz4SyWvCmdbbCw%3D%3D.Iff1ZJrVdvN%2BGcpRuaMYCZl7y08SASXpQB9ud130Hf3rAQqepy3asxPD0NgnmQQymVQOmKrNhUHAbP98gG%2BMh%2FsW8lxJ5OWXqKZXOSwlp5i9yqqNA70Jhzcb%2Fp0Q%2FS3d8tt%2FS7xsOO60vKMmBEnc7ogulrfhPxiN%2FAZ1rYybtyDbJbHi9SlhKhLnJQfzpLea1t2I6dLfk%2FKP7v3VgkvQXYUiG5KjmF%2F8ibqJbmCMLwE%3D)) ![image.png](https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250103/0b7a90bd159dc804ef2cbbc2f3464974.png) 但我用苹果手机测试都不行,测试代码如下: recordHandler(e) { if (this.source === 'ios') { localStorage.setItem('unload', '90') } this.sendBack() }, 理论上来说,如果我点击左上角的关闭按钮,如果浏览器监听到了pagehide事件,它就会执行recordHandler里面的方法,就会给localStorage设置一个unload的值,但我用苹果手机测试始终没有成功,有大神知道怎么兼容吗?

阅读量:258

点赞量:13

问AI
页面直接关闭时有一些API并不会触发,可以借借鉴这个问题使用 "onbeforeunload" 这个API 👉 "直接关闭浏览器或者标签页能否触发vue组件的beforeDestroy生命周期?" (https://segmentfault.com/q/1010000043690736)