支付寶小程序定時刷新條形碼、二維碼功能

 

axml文件中：<canvas id="barcode"></canvas>

js文件中：

下載轉碼包：$ npm install wxbarcode或者從Github上下載包https://github.com/alsey/wxbarcode

首先引入轉碼包import {barcode, qrcode} from '../../utils/code/index';

import {barcode, qrcode} from '../../utils/code/index';

 data中設置：

data: {
    // 存儲定時器
   setInter:''
},

 方法：

 // 自動刷新
  autoRefresh: function() {
    let that = this;
    //先生成一次
      that.createBarCode();
   //定義定時器 30秒自動刷新一次
    that.data.setInter = setInterval(function () {
       that.createBarCode();
    }, 30000);
    that.setData({
      st: Date.parse(new Date())
    })
  },
 // 停止自動刷新
  stopRefresh: function() {
   let that = this
   clearInterval(that.data.setInter)
  },
   createBarCode: function () {
//條形碼：
    barcode('barcode', code , 600, 220);//創建條形碼，code可以爲後臺請求回來需要轉碼的數據
//二維碼：
qrcode('qrcode', code , 600, 220);//創建條形碼，code可以爲後臺請求回來需要轉碼的數據
    let that = this
    let ct = Date.parse(new Date())
    if ((ct - that.data.st) > that.data.expireTime * 1000 ) { //超時，停止刷新
      clearInterval(that.data.setInter)
    } else {
      ...
    }
  },