独梦寒风
独梦寒风
  • 发布:2021-10-27 14:53
  • 更新:2023-10-31 17:16
  • 阅读:2396

PDA扫码在uniapp中的使用

分类:uni-app

该方式仅限广播模式使用,使用前请注意是否设置好;
该方法参考别人,但没使用全局监听方式,而是使用每次进出页面重新加载组件的方式.

参考部分

https://ask.dcloud.net.cn/article/37294;  
http://blog.itpub.net/31486267/viewspace-2739999/  

使用部分

<template>  
    <view>  
        <view class="">  
            扫描结果:{{name}}  
        </view>  
        <monitorScanCode v-if="scanCodeIsShow" @resultCode="resultCode"></monitorScanCode>  
    </view>  
</template>  

<script>  
import monitorScanCode from '@/components/monitorScanCode/monitorScanCode.vue';  
export default {  
    data() {  
        return {  
            name:'请扫描',  
            scanCodeIsShow: false //控制监听扫描头 组件重新加载  
        };  
    },  
    components: {  
        monitorScanCode  
    },  
    onLoad() {},  
    onShow: function() {  
        this.scanCodeIsShow = true;  
    },  
    methods: {  
        resultCode(item) {  
            this.name=item;  
            console.log(item, '结果');  
        }  
    },  
    // 页面隐藏  
    onHide() {  
        this.scanCodeIsShow = false;  
    },  
    // 页面卸载  
    onUnload() {  
        this.scanCodeIsShow = false;  
    }  
};  
</script>  

<style lang="scss"></style>

组件部分

<template>  
    <view class="content"></view>  
</template>  

<script>  
var main, receiver;  
var shakeIsShow = false;  
export default {  
    name:'monitorScanCode',  
    data() {  
        return {  
        };  
    },  
    created(option) {  
        this.monitorScan();  
    },  
    // 组件销毁  
    destroyed(){  
        this.cancelScan();  
    },  
    methods: {  
        // 广播监听绑定  
        monitorScan() {  
            // PDA扫描必须设置广播模式  
            main = plus.android.runtimeMainActivity(); //获取activity  
            let IntentFilter = plus.android.importClass('android.content.IntentFilter');  
            let filter = new IntentFilter();  
            filter.addAction('android.intent.ACTION_DECODE_DATA'); //广播动作  

            let that = this;  
            let context = plus.android.importClass('android.content.Context');  
            let Intent = plus.android.importClass('android.content.Intent');  
            receiver = plus.android.implements('io.dcloud.feature.internal.reflect.BroadcastReceiver', {  
                onReceive: function(context, intent) {  
                    plus.android.importClass(intent); //引入intent类  
                    let data = intent.getStringExtra('barcode_string'); //广播数据标签  
                    that.antiShake(data);  
                }  
            });  
            main.registerReceiver(receiver, filter); //注册监听  
        },  
        //取消监听扫描头  
        cancelScan() {  
            main.unregisterReceiver(receiver);  
        },  
        //防重复  
        antiShake: function(code) {  
            if (shakeIsShow) return false;  
            shakeIsShow = true;  
            setTimeout(function() {  
                shakeIsShow = false;  
            }, 150);  
            this.$emit("resultCode", code)  
        }  
    }  
};  
</script>  

<style>  
page {  
    background-color: #efeff4;  
}  
.content {  
    text-align: center;  
}  
</style>  
1 关注 分享
3***@qq.com

要回复文章请先登录注册

3***@qq.com

3***@qq.com

插眼
2023-10-31 17:16
不会飞的黄老板

不会飞的黄老板

占个位置,以待之后好找
2023-07-28 23:32