通过 EventBus 完美解决微信手机号授权,第一次失败,第二次成功问题

之前遇到了这个问题,使用的是settimeout 解决的,但是当用户特别卡的时候,网速特别慢的时候1000是不够的,问题会复现,所以通过eventbug进行实时监听,拿到sessionkey进行触发事件,安排

详细问题描述(settimeout解决方案):点我啦

1、先在项目中进行封装公共eventbus组件

//创建EventBus对象
let EventBus = function () {
    console.log("eventbus init...");
  };
  //准备数组容器
  var objBus = [], arrbus = [];
  //向原型中添加方法
  EventBus.prototype = {
    obj: {
      set: function (key, action) {
        if (key && action) {
          var map = {};
          map.k = key;
          map.v = action;
          //如果存在,则删除之前添加的事件
          for (var i = 0, busLength = objBus.length; i < busLength; i++) {
            var tempMap = objBus[i];
            if (tempMap.k == key) {
              objBus.splice(i, 1);
            }
          }
          objBus.push(map);
        }
      // },
      get: function (key) {
        if (key) {
          for (var i = 0, busLength = objBus.length; i < busLength; i++) {
            var map = objBus[i];
            if (map.k == key) {
              return map.v();
            }
          }
        }
      }
    },
    emit: function (key, data) {
      if (key) {
        for (var i = 0, busLength = arrbus.length; i < busLength; i++) {
          var map = arrbus[i];
          if (map.k == key) {
            return map.v(data);
          }
        }
      }
      return new Promise((resolve, reject) => { resolve() })
    },
    on: function (key, action) {
      if (key && action) {
        var map = {};
        map.k = key;
        map.v = action;
        arrbus.push(map);
      }
    },
    arr: {
      push: function (key, action) {
        if (key && action) {
          var map = {};
          map.k = key;
          map.v = action;
          arrbus.push(map);
        }
      },
      pop: function (key) {
        if (key) {
          for (var i = 0, busLength = arrbus.length; i < busLength; i++) {
            var map = arrbus[i];
            if (map.k == key) {
              map.v();
            }
          }
        }
      }
    }
  }
  var eventBus = new EventBus()
  module.exports = {
    eventBus: eventBus
  }
  

2:在组件中引用进行触发

	var eventBus = require('@/utils/eventBus.js')
	//当sessionKye数据拿到的时候触发事件
	eventBus.eventBus.emit('getUserData') //触发事件

3:在需要的组件进行监听

	在button按钮上面绑定的获取用户信息事件
	binduserphone(data){
			this.$store.state.WxUserData=data
			this.retrunUserData()
	},
	//监听的方法
	eventBus.eventBus.on('getUserData',()=> {
				this.$store.state.canStandard=true
				this.retrunUserData()//触发方法
	})
	//触发事件
	retrunUserData(){
		if(this.$store.state.canStandard&&this.$store.state.WxUserData!=null){
			//此时sessionkey和用户信息都拿到了
			this.$emit('getphonenumber', this.$store.state.WxUserData);
		}
	},

canStandard:全局判断是否达到返回的标准sessionKey是否返回了,
WxUserData:用户是否点击了确定授权按钮
当都满足了,用户进行下一步,授权成功

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值