vue 扫描二维码，获取二维码上的信息

扫描二维码和相册识别二维码 html5plus

<template>
    <div id="bcid">
    </div>
</template>

<script lang="ts">
    import {$, Component, getAjax, postAjax, putAjax, url, Vue, Watch,MessageBox} from '../../untis/common';

    @Component({
        components: {},
    })
    export default class login extends Vue {
        mounted(){
            this.startRecognize();
        }
        // 创建扫描控件
        startRecognize() {
            console.log(1);
            //@ts-ignore
            if (!window.plus) return;
            //@ts-ignore
            console.log('window.plus',window.plus);
            //@ts-ignore
            let scan = new plus.barcode.Barcode('bcid');
            console.log('scan',scan);
            scan.onmarked = onmarked;
            function onmarked(type:any, result:any, file:any) {
                switch (type) {
                    //@ts-ignore
                    case plus.barcode.QR:
                        type = 'QR'
                        break
                    //@ts-ignore
                    case plus.barcode.EAN13:
                        type = 'EAN13'
                        break
                    //@ts-ignore
                    case plus.barcode.EAN8:
                        type = 'EAN8'
                        break
                    default:
                        type = '其它' + type
                        break
                }
                // 获得code
                result = result.replace(/\n/g, '')
                console.log('result',result);
            }
            scan.start()
        }

    }
</script>

<style lang="less">
    @import "../../assets/less/common.less";
    #app{
        height:100%;
    }
    #bcid {
        width: 100%;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom:3rem;
        text-align: center;
        color: #fff;
        background: #ccc;
    }
</style>