好久沒有寫文章了做葵，最近公司要做海報分享的活動硕旗，需要在小程序中生成掃了之后可以跳轉(zhuǎn)普通網(wǎng)頁的二維碼士修，就在github上面找了一下，確實找到了一個兼容兼容性比較不錯的澈灼，給大家分享一下竞川。
中間嘗試了不少，有些在Android上生成會出現(xiàn)問題叁熔，親測這個有效委乌，兼容比較好，已經(jīng)應(yīng)用到我們項目中了荣回。
由于在使用便利性方面考慮遭贸，我對這個進行了一定的改動，新增了二維碼白邊功能和支持回調(diào)函數(shù)直接獲取臨時文件的功能心软，希望能夠幫助到大家壕吹。
生活娛樂：夏天到了著蛙，來喝點雪碧可樂吧?
github地址
weapp-qrcode 點擊查看(歡迎star)，其中附有源工程地址
使用
在github上下載工程耳贬，主要用到的文件是/utils/weapp-qrcode.js文件
引入文件：
可以將文件直接放在自己工程下面引入使用
import QRCode from '/utils/weapp-qrcode.js'
使用：
new QRCode('myQrcode',{
text: 'http://www.tongxingschool.com',
width: 200,
height: 200,
padding: 12, // 生成二維碼四周自動留邊寬度踏堡，不傳入默認(rèn)為0
correctLevel: QRCode.CorrectLevel.L, // 二維碼可辨識度
callback: (res) => {
console.log(res.path)
// 接下來就可以直接調(diào)用微信小程序的api保存到本地或者將這張二維碼直接畫在海報上面去，看各自需求
}
})
結(jié)構(gòu)：
<canvas class="canvas-code"canvas-id="myQrcode" style="background:#fff;width: 200px;height: 200px;"/>
注意事項
- 二維碼寬高咒劲，js代碼和結(jié)構(gòu)中的寬高需要一致暂吉，寬高的樣式一定要寫成內(nèi)聯(lián)樣式，不然會有意想不到的效果??
- padding的顏色自己控制即可缎患，canvas的背景色就是留邊的顏色
- correctLevel是生成二維碼可辨識度的級別慕的，級別越高可辨識度越高，從低到高依次是M挤渔、L肮街、H、Q
下篇預(yù)報
生成分享海報
希望能給大家?guī)韼椭?/p>
以上就是今天分享的所有內(nèi)容了判导，謝謝觀看嫉父，喜歡可以點贊加關(guān)注哦??
相關(guān)推薦
微信小程序分享小程序碼的生成（帶參數(shù)）以及參數(shù)的獲取
微信小程序生成分享海報（附帶二維碼生成）
微信小程序生成清晰海報
簡單實現(xiàn)小程序自定義導(dǎo)航欄（基于mpvue）
微信小程序中的版本管理
生活娛樂
！驚眼刃，跑步竟然能跑出錢來（你的額外收入）
大家注意啦绕辖，產(chǎn)品經(jīng)理打人啦！(一)
完
