出现这样的问题无非就是第一次进入项目之后,在微企浏览器添加了一条历史记录,之后由于授权成功回来,会再一次添加一条记录,所以我们解决的常规方法就是利用pushState方法加上关闭当前微信窗口API得以解决问题

history.pushState(null, null, document.URL)
如果页面组件作了缓存,就需要利用activated和beforeRouteLeave
activated() {if (window.history && window.history.pushState) {history.pushState(null, null, document.URL)window.addEventListener('popstate', this.goBack, false)}
},
// 路由守卫
beforeRouteLeave(to, from, next) {window.removeEventListener('popstate', this.goBack, false) // 跳转时需要清空浏览器添加的记录next()
},

methods: {

goBack() { // 点击浏览器的返回触发的方法let timer = setTimeout(function () {document.addEventListener("WeixinJSBridgeReady",function () {WeixinJSBridge.call("closeWindow");},false);//这个可以关闭ios系统的手机WeixinJSBridge.call("closeWindow");clearInterval(timer)//这个可以关闭安卓系统的手机}, 500)this.$router.go(-2)
},

}

另外需要注意的是:

1.跳转到详情时,需要利用Router.replace()跳转 ,否则如果跳转到详情再返回来首页列表  还是会出现返回两次才能正常退出项目。

2.因为在vue项目使用了微信WeixinJSBridge对象,此时会报错WeixinJSBridge为未定义,导致不能正常打开和打包发布,

所以当我们用vue实现调取微信api时,虽然WeixinJSBridge在微信内置浏览器中可以使用,但在脚手架编译或者发布时会提示WeixinJSBridge is not defined,使得我们无法调试也无法发布,无法验证功能。究竟改如何解决,这需要根据vue-cli的版本来设置,百度中大部分都没有提及。

vue-cli3之前的版本根目录下是有eslintrc.js的,直接在文件中增加"globals": {"WeixinJSBridge" : false}即可

如果是vue-cli3之后版本,需要在package.json中找到eslintConfig,然后增加"globals": {"WeixinJSBridge" : false}即可

至此,就可以编译通过正常调试和发布了。

(专卖店项目)

进入微信企业项目授权回跳之后退出项目需要点击两次(手机的返回主键,回退键)才能正常退出的问题解决相关推荐

  1. 使用uniapp实现锚点跳转,主按钮消失在视口时显示锚点按钮,点击锚点按钮页面返回主按钮位置

    使用uniapp实现锚点跳转,主按钮消失在视口时显示锚点按钮,点击锚点按钮页面返回主按钮位置 onpagescroll页面滑动监听事件 获取视口高度和按钮(btn-bg)距离顶部高,便可计算按钮离开视 ...

  2. 微信公众号授权登录vue移动端项目

    1. 在需要授权登录的页面中 if (this.$route.query.uuid) {this.wxOpenId = this.$route.query.uuid;};let isWeixin = ...

  3. 微信公众号H5页面跳转至app的某个页面,如果手机内没有app,则进入下载页面

    安卓实现方法: $(function(){           var Id = getParameter("goodsid"); //此操作会调起app并阻止接下来的js执行,进 ...

  4. PHP快速实现微信小程序授权

    小程序开发讲究的就是一个敏捷软件开发模式,作为微信小程序授权也有多个项目的积累,所以想贴出来代码,让需要用到的朋友拿来即用(当然前提是需要修改自己的小程序appid和秘钥). 前端调用wx.login ...

  5. 微信企业支付(一)注意

    今天看了微信企业支付,没用代码实现,用postman简单测试了借口,看看返回数据,折腾大半天,总结: ca证书,官方给的证书工具无法运行,检查了dll文件,下载了各种修复工具什么的,结果,换个电脑好了 ...

  6. H5微信公众号授权登录

    目录 一.封装获取code的函数.存储token函数.获取token函数 二.点击请求微信公众号授权并跳转 三.重定向跳转会当前链接获取code登录 四.整体流程的描述: 一.封装获取code的函数. ...

  7. oracle主键从键怎么看,分析Oracle主键的跳号现象

    从做Jforum项目以来,以来遇到一个很明显的现象,就是每个表的主键都出现跳号现象.具体表现在:当一次操作若干条数据时,自动增 从做Jforum项目以来,以来遇到一个很明显的现象,就是每个表的主键都出 ...

  8. mysql 主键冲突 多个事务回滚_MySQL实战45讲Day38----自增主键不是连续的原因

    一.自增主键不连续的原因: 对于表: CREATE TABLE `t` ( `id` int(11) NOT NULL AUTO_INCREMENT, `c` int(11) DEFAULT NULL ...

  9. Mybatis 主键插入回显

    一. Mysql ⏹方式1: 使用属性返回新增记录的ID useGeneratedKeys属性: 是否使用获取新增记录的id值 keyProperty属性: 将返回的主键值设置给哪个属性 <in ...

最新文章

  1. JQuery实现倒计划按钮
  2. .NET MongoDB Driver 2.2使用示例
  3. 阿云搭建php博客,阿云的应聘故事
  4. 【Jmeter】压力测试工具 Jmeter 使用
  5. ActiveReports报表控件教程之单元格合并
  6. 04.卷积神经网络 W1.卷积神经网络(作业:手动/TensorFlow 实现卷积神经网络)
  7. 肿瘤化疗无效是对预先存在的突变的选择还是诱发新突变,Cell给你答案
  8. 信息学奥赛一本通 1103:陶陶摘苹果 |1930:【05NOIP普及组】陶陶摘苹果 | OpenJudge NOI 1.6 02 | 洛谷 P1046 [NOIP2005 普及组] 陶陶摘苹果
  9. 论文解读丨无参数的注意力模块SimAm
  10. lamp+cacti+ntop+thold+nagios+syslog
  11. [FAQ10926][USB serial number客制化][系列5]:如何实现可以通过pc工具来修改serialnumber?
  12. 微信小程序分享二维码扫码进入如何获取参数,小程序码进入参数为啥拿不到;
  13. 替罪羊树(Scapegoat Tree)
  14. 互联网赚钱指南!我是如何零成本空手套白狼?
  15. [转载]关于太阳(卫星)天顶角,太阳高度角,太阳方位角的整理_akala啦_新浪博客...
  16. 博途PLC 1200/1500PLC 工艺对象PID PID_Compact详细解读
  17. Play with OSM (by quqi99)
  18. 5G mMTC场景下NB-IoT / eMTC增强技术
  19. 汶川地震纪念感人mv《孩子快抓紧妈妈的手》
  20. python开发环境部署以及调试教程

热门文章

  1. 人的一生需要经历很多的磨难和痛苦
  2. python生成测试数据_Python基于Hypothesis测试库生成测试数据
  3. 一政网给了我公考上岸的机会
  4. android全平台编译libjpeg-turbo并基于ANativeWindow加载JPEG图片
  5. 显卡检测神器 GPU-Z v2.30.0 简体中文汉化版
  6. 软件系统等保方案,市政项目,投标项目必须
  7. 开启TX2、Xavier最大性能 Opening the Max performance of TX2、Xavier
  8. 数据迁移工具之DataX
  9. 谈谈AssetStore及其脱离Unity下载方法
  10. 人脸识别技术原来还有这个用途?赶紧get