IOS手机微信浏览器点击返回按钮

清疚 2023-02-20 02:57 24阅读 0赞

**项目中有一个微信扫码开箱的功能，在存在多个包裹的情况下，在微信浏览器点击返回按钮时会出现再次开箱的bug，以下方法为主要争对此bug的处理**

methods: { 
            pushHistory() { 
                var state = { 
                    title: this.$route.meta.title,
                    url: this.$route.path
                }
                window.history.pushState(state, "title", "#")
            },
            // 检查微信环境
            weixinClosePage() { 
                if (typeof WeixinJSBridge == "undefined") { 
                    if (document.addEventListener) { 
                        document.addEventListener('WeixinJSBridgeReady', weixin_ClosePage, false)
                    } else if (document.attachEvent) { 
                        document.attachEvent('WeixinJSBridgeReady', weixin_ClosePage)
                        document.attachEvent('onWeixinJSBridgeReady', weixin_ClosePage)
                    }
                } else { 
                    weixin_ClosePage()
                }
            },
            // 关闭微信浏览器
            weixin_ClosePage() { 
                WeixinJSBridge.call('closeWindow')
            }
    },
    created() { 
        this.pushHistory()
        window.addEventListener("popstate", function(e) { 
            weixinClosePage()
        }, false)
    },
    beforeDestroy() { 
        window.removeEventListener('popstate', false) // false阻止默认事件
    }

**如有不对，请各位指出，谢谢**

发表评论取消回复

表情：

评论列表（有 0 条评论，24人围观）

还没有评论，来说两句吧...

相关阅读

相关监听手机点击返回按钮

在页面加载时进行监听 if (window.history && window.history.pushState) { history.pushS

我会带着你远行/ 2023年06月08日 06:42/ 0 赞/ 157 阅读

相关 IOS手机微信浏览器点击返回按钮

项目中有一个微信扫码开箱的功能，在存在多个包裹的情况下，在微信浏览器点击返回按钮时会出现再次开箱的bug，以下方法为主要争对此bug的处理 methods: {

清疚/ 2023年02月20日 02:57/ 0 赞/ 25 阅读

相关微信小程序点击按钮跳转页面

> wxml <button bindtap="goToNotice" ></image></button> > js Page({ dat

我会带着你远行/ 2022年11月11日 13:22/ 0 赞/ 428 阅读

相关 Android中PopupWindow点击返回按钮关闭

1. View keyboardView = LayoutInflater.from(activity).inflate(R.layout.random\_keyboard,

电玩女神/ 2022年10月01日 00:48/ 0 赞/ 472 阅读

相关微信小程序悬浮按钮-点击传参

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhp

布满荆棘的人生/ 2022年09月04日 05:46/ 0 赞/ 383 阅读

相关 CSS 兼容手机浏览器点击蓝色边框

{ -webkit-tap-highlight-color: transparent; -webkit-appeara

谁借莪１个温暖的怀抱￠/ 2022年08月06日 10:25/ 0 赞/ 284 阅读

相关 iOS点击获取短信验证码按钮

概述 iOS点击获取短信验证码按钮, 由于 Demo整体测试运行效果 , 整个修改密码界面都已展现, 并附送正则表达式及修改密码逻辑. 详细代码下载：[htt

红太狼/ 2022年05月31日 10:16/ 0 赞/ 446 阅读

相关 js 实现浏览器返回按钮返回页面并刷新页面微信可用

监听浏览器返回按钮，监听到以后执行来源重载微信可用 $(document).ready(function(e) { var cou

朱雀/ 2022年05月23日 01:16/ 0 赞/ 436 阅读

相关从微信浏览器跳转到手机浏览器（ios和android）

在微信中点击网址，跳转到微信浏览器，点击跳转到浏览器，fir页面下载安装APP。点击按钮，右上角...打开，在浏览器打开。再点击按钮，然后跳转到fir.im去下载安装软件。

客官°小女子只卖身不卖艺/ 2022年03月29日 12:58/ 0 赞/ 692 阅读

相关 vue 监听浏览器返回(登录之后希望点击浏览器按钮不再返回登录页)

分享页面时，希望点击浏览器回退按钮，回到项目首页，增加访问量。需要监听浏览器的回退按钮，并阻止其默认事件。具体步骤如下： 1、挂载完成后，判断浏览器是否支持popst

比眉伴天荒/ 2022年03月10日 13:17/ 0 赞/ 685 阅读