zoukankan      html  css  js  c++  java
  • 支付宝小程序开发——根据字符串生成二维码

    支付宝小程序开发中,如果需要根据字符串生成二维码,那么可以直接使用 qrcode 插件,你无需引用js,直接使用开发者工具的npm功能就可以了。

    一. 安装插件:

    1.开发者工具左侧工具栏点击如图所示的图标(npm):

    2.NPM包管理界面,输入框中输入 qrcode 并按回车键,等待插件安装完成:

    二. 引用并使用插件:

     1 //引用插件
     2 const QRCode = require('qrcode');
     3 Page({
     4   data: {
     5     imgSrc: ''
     6   },
     7   onReady() {
     8     //根据字符串生成svn格式的二维码
     9     let self = this;
    10     QRCode.toString('13549687961', { type: 'svg' }, function(err, url) {
    11       let str = 'data:image/svg+xml;base64,' + Buffer(url).toString('base64');
    12       self.setData({
    13         imgSrc: str
    14       })
    15     });
    16   }
    17     ......

    页面引用:

    <image src="{{imgSrc}}"  style="100%;" mode="aspectFit" />

    如此,编译项目,二维码生成:

     三. 需要生成多个券码的情况:

    如果是根据数组中的某个券码生成二维码,那么可以封装这个方法:

    //根据字符串生成二维码
      getQrcode(str) {
        var qrcode=''
        QRCode.toString(str, { type: 'svg', errorCorrectionLevel: 'H', maskPattern: 4, version: 2 }, function(err, url) {
          qrcode= 'data:image/svg+xml;base64,' + Buffer(url).toString('base64');
        });
        return qrcode
      },
      //将券码合成二维码并保存到卡券详情数据中
      arr.forEach(item=>{
        console.log(item)
        item["qrcode"]=self.getQrcode(item.coupon_number)
      })
      self.setData({
        cardData: arr
      })    
  • 相关阅读:
    RabbitMQ 入门指南(Java)
    RabbitMQ 四种Exchange
    使用Spring AMQP开发消费者应用
    RestTemplate源码浅析
    Spring Boot整合Rabbitmq
    RestTemplate实践(及遇到的问题)
    binlog之三:binlog开启、查看
    微服务架构的六种模式
    SpringBoot自动化配置之四:@Conditional注解详解
    微服务理论之一:应用架构演进史
  • 原文地址:https://www.cnblogs.com/xyyt/p/11737232.html
Copyright © 2011-2022 走看看