You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
61 lines
2.0 KiB
61 lines
2.0 KiB
1 year ago
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
# weapp-qrcode
|
||
|
|
微信小程序生成二维码工具
|
||
|
|
|
||
|
|
> 生成二维码数据的主要代码来自[davidshimjs/qrcodejs](https://github.com/davidshimjs/qrcodejs)，因为它这个里面生成二维码图片的功能在微信小程序里不能使用，我将这个功能改写成可以在微信小程序中使用。
|
||
|
|
|
||
|
|
## 截图
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
## 使用
|
||
|
|
|
||
|
|
页面`wxml`中放置绘制二维码的`canvas`:
|
||
|
|
```
|
||
|
|
<canvas class='canvas' canvas-id='canvas' bindlongtap='save'></canvas>
|
||
|
|
```
|
||
|
|
|
||
|
|
页面`js`中引入:
|
||
|
|
```
|
||
|
|
var QRCode = require('../../utils/weapp-qrcode.js')
|
||
|
|
```
|
||
|
|
|
||
|
|
页面加载好后:
|
||
|
|
```js
|
||
|
|
//传入wxml中二维码canvas的canvas-id
|
||
|
|
var qrcode = new QRCode('canvas', {
|
||
|
|
// usingIn: this,
|
||
|
|
text: "https://github.com/tomfriwel/weapp-qrcode",
|
||
|
|
width: 150,
|
||
|
|
height: 150,
|
||
|
|
colorDark: "#000000",
|
||
|
|
colorLight: "#ffffff",
|
||
|
|
correctLevel: QRCode.CorrectLevel.H,
|
||
|
|
});
|
||
|
|
```
|
||
|
|
|
||
|
|
`usingIn`为可选参数，详情清查卡[在自定义组件使用时失效及解决思路 #1](https://github.com/tomfriwel/weapp-qrcode/issues/1)
|
||
|
|
|
||
|
|
`text`为需要转化为二维码的字符串；
|
||
|
|
|
||
|
|
`width`和`height`为绘制出的二维码长宽，这里设置为跟`canvas`同样的长宽；
|
||
|
|
|
||
|
|
`colorDark`和`colorLight`为二维码交替的两种颜色；
|
||
|
|
|
||
|
|
`correctLevel`没有细看源码，命名上看应该是准确度；
|
||
|
|
|
||
|
|
如果需要再次生成二维码，调用`qrcode.makeCode('text you want convert')`。
|
||
|
|
|
||
|
|
## 主要流程
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
## TODO
|
||
|
|
|
||
|
|
* https://github.com/SumiMakito/Awesome-qr.js
|