Vue 生成二维码， Hbulider 调用 手机相册图片 识别二维码

一.Vue 生成二维码

推荐：https://juejin.im/post/5c760ab7f265da2da00ebee2

 

二、Hbulider 调用 手机相册图片 识别二维码

Hbuilder api文档：

https://www.html5plus.org/doc/zh_cn/gallery.html

1.识别二维码的支持包 （Hbuilder api文档barCode也可以识别吧）

我参考了这篇博客：

https://blog.csdn.net/qq_37816525/article/details/94571557

安装包：

npm install qrcode-reader
//我记得我没安装qrcode-decoder，应该包qrcode-reader会连带安装？

2.直接贴代码

注意：在浏览器中运行是不支持plus的，只能在Hbuilder或则真机里测试

//导入
import QrcodeDecoder from 'qrcode-decoder';   


 //从相册选择照片直接调用这个函数就可以解析你用Qrcode生成的二维码了
    galleryImg(){
      var _this = this;
      plus.gallery.pick(
          (path) => {
            console.log('test',path);
            let qr = new QrcodeDecoder();
            qr.decodeFromImage(path).then((res) => {
              //打印结果为 解析出来的 二维码地址
              alert(res.data);
              //不是二维码： undefine
              // 不是我们定义的二维码
              // alert('友好提示');
            })
          },
          ( e ) => {
            console.log( "取消选择图片" );
          },
          {filter:"image"});
    },