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();
    },

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

      

      

  • 相关阅读:
    一次聚类引发的一系列问题(工作经验篇)
    SQLServer数据库返回错误的国际化
    记一次SQL优化
    java设计模式-工厂模式(springweb为例子)
    JAVA中的泛型(Generic)
    spring源码分析-core.io包里面的类
    java设计模式-代理模式
    javaWeb正则表达式
    Java中的泛型
    关于API,前后端分离
  • 原文地址:https://www.cnblogs.com/rrene/p/9549870.html
Copyright © 2011-2022 走看看