小程序制作二维码和条形码

努力做一个好前端

已于 2022-01-20 17:48:24 修改

阅读量909

点赞数

分类专栏：小程序问题的收集自己的小问题收集文章标签：小程序前端 css3

于 2022-01-20 17:41:24 首次发布

本文链接：https://blog.csdn.net/weixin_45865992/article/details/122606733

版权

自己的小问题收集同时被 2 个专栏收录

39 篇文章 2 订阅

订阅专栏

小程序问题的收集

32 篇文章 2 订阅

订阅专栏

canvas里的内容就是绘制的二维码

<view style="margin-left:130rpx">
        <canvas canvas-id="qrcode" style="width:402rpx !important;height:404rpx !important" />
      </view>
      <view style="margin-top:110rpx;margin-left:77rpx; display: flex;flex-direction: column;">
        <canvas canvas-id="barcode" style="display:block;height:93rpx !important" />
        <view class='cardNumber'>{{phone}}</view>
      </view>

然后点开js

var wxbarcode = require('../../utils/code.js');			//引入

  wxbarcode.barcode('barcode', 'obj.couponNo', 525, 93);
    // id: wxml文件中的 Canvas ID  code: 用于生成二维码的字符串 width: 生成的二维码宽度，单位 rpx height: 生成的二维码高度，单位 rpx
    wxbarcode.qrcode('qrcode', 'obj.couponNo', 402, 404);