微信小程序> 小程序码转二维码-微信小程序条码、二维码生成模块-小程序二维码

小程序码转二维码-微信小程序条码、二维码生成模块-小程序二维码

浏览量:1566 时间: 来源:findhappy117

1.代码地址如下:http://www.demodashi.com/demo/13994.html

一、前期准备工作

2.软件环境:微信开发者工具官方下载地址:https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html

1、基本需求。实现一维条码,二维码的快速生成2、案例目录结构

3.

二、程序实现具体步骤1.条码index.wxml代码!--index.wxml--viewclass="containerpage"viewclass="panel"viewclass="header"/viewviewclass="barcode"viewclass="barnum"{{code}}/viewcanvascanvas-id="barcode"//viewviewclass="qrcode"canvascanvas-id="qrcode"//view/view/view2.条码index.wxss代码/**index.wxss**/page{background-color:#439057;}.page{display:flex;flex-direction:column;justify-content:center;align-items:center;}.container{padding-bottom:10rpx;}.panel{display:flex;flex-direction:column;justify-content:space-between;align-items:stretch;box-sizing:border-box;width:710rpx;margin-top:40rpx;border-radius:10rpx;background-color:#fff;}.header{height:140rpx;background-color:#f0f0f0;border-radius:10rpx10rpx00;}.barcode{display:flex;height:320rpx;flex-direction:column;justify-content:center;align-items:center;}.barnum{width:670rpx;height:100rpx;line-height:100rpx;font-size:38rpx;font-weight:bold;text-align:center;letter-spacing:10rpx;white-space:nowrap;}.barcodecanvas{width:680rpx;height:200rpx;}.qrcode{height:420rpx;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;}.qrcodecanvas{width:420rpx;height:420rpx;}3.条码index.js逻辑代码//index.jsvarwxbarcode=require('../../utils/index.js');Page({data:{code:'http://blog.geekxz.com'},onLoad:function(){wxbarcode.barcode('barcode','http://blog.geekxz.com',680,200);wxbarcode.qrcode('qrcode','http://blog.geekxz.com',420,420);}})三、案例运行效果图

4.

四、总结与备注

5.暂无微信小程序条码、二维码生成模块

6.代码地址如下:http://www.demodashi.com/demo/13994.html

7.注:本文著作权归作者,由demo大师发表,拒绝转载,转载需要作者授权

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎