微信小程序生成二维码的示例代码
2019-03-31 21:37
441 查看
好久没有写文章了,最近公司要做海报分享的活动,需要在小程序中生成扫了之后可以跳转普通网页的二维码,就在github上面找了一下,确实找到了一个兼容兼容性比较不错的,给打加分享一下。
中间尝试了不少,有些在Android上上城会出现问题,亲测这个有效,兼容比较好,已经应用到我们项目中了。
由于在使用便利性方面考虑,我对这个进行了一定的改动,新增了二维码白边功能和支持回调函数直接获取临时文件的功能,希望能够帮助到大家。
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, // 生成二维码四周自动留边宽度,不传入默认为0 correctLevel: QRCode.CorrectLevel.L, // 二维码可辨识度 callback: (res) => { console.log(res.path) // 接下来就可以直接调用微信小程序的api保存到本地或者将这张二维码直接画在海报上面去,看各自需求 } })
结构:
<canvas class="canvas-code"canvas-id="myQrcode" style="background:#fff;width: 200px;height: 200px;"/>
注意事项
- 而宽高,js代码和结构中的宽高需要一致,宽高的样式一定要写成内联样式,不然会有意想不到的效果😁
- padding的颜色自己控制即可,canvas的背景色就是留边的颜色
- correctLevel是生成二维码可辨识度的级别,级别越高可辨识度越高,从低到高以此是M、L、H、Q
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
您可能感兴趣的文章:
相关文章推荐
- 微信小程序动态生成二维码的实现代码
- 微信小程序前端模板自动生成,不用写代码
- php生成二维码程序代码
- 微信扫描二维码登录网站代码示例
- 微信小程序前端界面代码生成工具
- 微信小程序如何生成指定页面带参数的微信小程序码或者二维码
- .NET开发微信小程序-生成二维码 - 转
- .NET开发微信小程序-生成二维码/上传图片到服务器
- 微信小程序-携带参数的二维码条形码生成
- 微信小程序生成分享海报方法(附带二维码生成)
- java 二维码生成与解析代码实现,程序源码下载可用
- [微信小程序]组件化开发,以一个自定义模块框组件当做示例(附完整示例代码和效果图)
- 微信小程序实现图片懒加载的示例代码
- [微信小程序]实现一个自定义遮罩层组件(完整示例代码附效果图)
- PHP生成微信小程序二维码
- 微信二维码名片生成示例【转】
- 微信小程序左右滑动切换页面示例代码--转载
- 微信小程序将字符串生成二维码图片的操作方法
- 微信小程序请求二维码:用户点击按钮生成带参二维码
- 微信小程序form表单组件示例代码