项目中有需求在导航框中使用微信扫一扫功能,特此记录一下。
与页面点击按钮调取扫一扫不同,如果是页面按钮 的话,每次点击可以每次调用,但是在导航栏里就需要有其他的方法。
//首先我们在data里定义一个变量data: {on: true},//紧接着我们在onShow里边定义//这里我们不能定义到onLoad里,否则只能加载一次。onShow: function () {console.log('onShow')var that = thisif (that.data.on) {var call = that.data.callwx.scanCode({success: (res) => {var id = res.resultwx.redirectTo({url: '/pages/scanpay/scanpay?shopId=' + id,})},fail: (err) => {console.log(err, 'fail')wx.switchTab({url: '/pages/index/index',})}})}},
如果我们将扫一扫的功能添加到onLoad里,无论怎样都只能调用一次。
重点来了
//我们在监听onHide事件中onHide: function () {var that = thisvar on = that.data.onthat.setData({on: !on})},
我们只能在onshow里判断,微信小程序在调取扫一扫功能的时候在弹出扫描框的一瞬间是走页面隐藏这个生命周期的。所以我们在隐藏事件中对我们定义的变量进行取反。
这样在每次扫描完成功或者失败后再次返回扫一扫这个页面就能够再次调用啦。