zoukankan      html  css  js  c++  java
  • vue移动app扫码功能

    第一步:

      

      上面这段代码写在index.html里面,我也不知道为什么,可能是全局的关系;

    第二步:

      

      定义一个按钮,点击启动扫码功能,另外再定义一个盒子来当做扫码的容器;我给这个盒子定义了一个id类名:bcid

    第三步: 第三步代码多,直接粘贴,方便你我他,我也是在别人手上抄过来,作了部分改变

        

    //创建扫描控件
    startRecognize1() {
    document.getElementById('bcid').style.display = 'block';
    document.getElementsByClassName('scanCode')[0].style.display = 'none';
    let that = this;
    if (!window.plus) return;
    scan = new plus.barcode.Barcode('bcid');
    scan.onmarked = onmarked;
    setTimeout(function(){
    that.startScan1();
    },100)

    function onmarked(type, result, file) {
    switch (type) {
    case plus.barcode.QR:
    type = 'QR';
    break;
    case plus.barcode.EAN13:
    type = 'EAN13';
    break;
    case plus.barcode.EAN8:
    type = 'EAN8';
    break;
    default:
    type = '其它' + type;
    break;
    }
    result = result.replace(/ /g, '');
    that.codeUrl = result;
    alert(that.codeUrl);
    if(that.codeUrl){
    that.cancelScan1();
    that.closeScan1();
    }
    }
    },
    //开始扫描
    startScan1() {
    if (!window.plus) return;
    scan.start();
    },
    //关闭扫描
    cancelScan1() {
    if (!window.plus) return;
    scan.cancel();
    },
    //关闭条码识别控件
    closeScan1() {
    document.getElementById('bcid').style.display = 'none';
    document.getElementsByClassName('scanCode')[0].style.display = 'block';
    if (!window.plus) return;
    scan.close();
    },

    ————————————————————————————————————————————————————————————————————————————————————————————

      

      

  • 相关阅读:
    css中span元素的width属性无效果原因及多种解决方案
    CentOS、Ubuntu、Debian三个linux比较异同
    linux系统中/etc/syslog.conf文件解读
    /proc/interrupts 和 /proc/stat 查看中断的情况
    网卡优化RPS/RFS
    关于Linux网卡调优之:RPS (Receive Packet Steering)
    rsync详解之exclude排除文件
    Linux rsync 同步实践
    CentOS 6.3下rsync服务器的安装与配置
    解决linux下/etc/rc.local开机器不执行的原因
  • 原文地址:https://www.cnblogs.com/rrene/p/9549870.html
Copyright © 2011-2022 走看看