1、判断平台

     判断不同平台并使用不同的扫码插件

2、钉钉扫码

       安装：npm install dingtalk-jsapi

       使用：import * as dd from "dingtalk-jsapi";

       判断钉钉平台：dd.env.platform !== "notInDingTalk

       主要代码：

      dd.ready(function() {

        dd.biz.util.scan({

          type: "all", //（如果只写"qr"，ios上会不生效）

          onSuccess: function(data) {

            console.log("扫码结果", data);

          },

          onFail: function(err) {

            if (Number(err.errorCode) === 10) {

                //如果用户取消操作的话则

            } else {

                //否则

        }

    },

---

3、微信扫码

判断微信平台：navigator.userAgent.toLowerCase().indexOf("micromessenger") !== -1

引入：在index.html里面写入

<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>          

主要代码：

appId, timestamp, nonceStr, signature都由后端接口获得

          wx.config({

            debug: false, // 是否开启调试模式

            appId, // 必填，公众号的唯一标识

            timestamp, // 必填，生成签名的时间戳

            nonceStr, // 必填，生成签名的随机串

            signature, // 必填，签名

            jsApiList: ["scanQRCode"] // 必填，需要使用的JS接口列表

          });

          wx.ready(() => {

            //调起微信扫一扫接口

            wx.checkJsApi({

              jsApiList: ["scanQRCode"], // 需要检测的JS接口列表,

              success: function(res) {

                console.log("检测JS接口结果:", res);

                wx.scanQRCode({

                  needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，

                  scanType: ["qrCode"], // 可以指定扫二维码还是一维码，默认二者都有

                  success: function(res) {

                    console.log("扫描单号", res.resultStr);

                    let result = res.resultStr; // 当needResult 为 1 时，扫码返回的结果

                    _this.$router.push({

                      name: "EditableDetail",

                      query: { result, editable: false }

                    });

                  },

                  cancel: function(res) {

                    //用户点击"X"取消操作

                    console.log("cancel", res);

                  }

                });

              }

            });

          });

          wx.error(function(resE) {

            console.log("wx.error", resE);

          });

4、welink扫码

判断welink平台：navigator.userAgent.toLowerCase().navigatorInfo.includes("welink") || navigatorInfo.includes("cloudlink")

准备：在index.html里面写入

<script src="https://open.welink.huaweicloud.com/wecode/docs/jsapi/2.0.0/hwh5-cloudonline.js"></script>    

主要代码：

 HWH5.scanCode({ needResult: 1 }) .then(res => {

          console.log(res);

        }).catch(err => {

           console.log(err)

});

4、桥接扫码

 ScanBridge().then(res => {

        console.log（'扫码结果', res）

    }).catch(err => {

         console.log（'err', err）

     });

js文件

//扫码插件

export const ScanBridge = () => {

    return new Promise((resolve, reject)=>{

      window.onSuccess = function (message) {

        console.log('onSuccess', message)

        resolve(message)

      }

      window.onError = function (message) {

        console.log('onError', message)

        reject(message)

      }

      let argument = {

        className: "ScanBridge",

        function: "scanner",

        successCallBack: "onSuccess",

        failCallBack: "onError",

      }

      HandBridge.postMessage(JSON.stringify(argument));

    })

  }