PDA uni-app 监听扫码广播的一个插件(日记)

转载 ask.dcloud.net.cn/article/37294

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

<script>  
    var main,receiver,filter;    
    var _codeQueryTag = false;    
    export default {  
        data() {  
            return {  
                scanCode: ''  
            }  
        },  
        created: function (option) {  
            this.initScan()  
            this.startScan();    
        },    
        onHide:function(){    
            this.stopScan();    
        },  
        destroyed:function(){    
            /*页面退出时一定要卸载监听,否则下次进来时会重复,造成扫一次出2个以上的结果*/    
            this.stopScan();    
        },    
        methods: {  
            initScan() {  
                let _this = this;  
                main = plus.android.runtimeMainActivity();//获取activity  
                var IntentFilter = plus.android.importClass('android.content.IntentFilter');   
                filter = new IntentFilter();    
                filter.addAction("android.intent.ACTION_DECODE_DATA"); // 换你的广播动作  
                receiver = plus.android.implements('io.dcloud.feature.internal.reflect.BroadcastReceiver',{  
                onReceive : function(context, intent) {  
                    plus.android.importClass(intent);     
                    let code = intent.getStringExtra("barcode_string");// 换你的广播标签  
                    _this.queryCode(code);    
                }});    
            },    
            startScan(){    
                main.registerReceiver(receiver,filter);  
            },    
            stopScan(){  
                main.unregisterReceiver(receiver);    
            },    
            queryCode: function(code){  
                //防重复  
                if(_codeQueryTag)return false;    
                _codeQueryTag = true;    
                setTimeout(function(){    
                    _codeQueryTag = false;    
                },150);  
                var id = code  
                console.log('id:', id)  
                uni.$emit('scancodedate',{code:id})  
            }  
        }  
    }  
</script>  

<style>  
    page {  
        background-color: #efeff4;  
    }  
    .content {  
        text-align: center;  
    }  
</style>

主页引入

import scanCode from "@/components/scan-code/scan-code.vue";

其他的页面引用方法:不需要再次引入scanCode
因为其他的页面都是从首页跳转过来的,所以其他的页面需要

onUnload() {
// 移除监听事件
uni.$off('scancodedate')
}
onLoad() {  
   var _this = this  
   uni.$on('scancodedate',function(data){  
        // _this 这里面的方法用这个 _this.code(data.code) 
    console.log('你想要的code:', data.code)  
   })  
},  
onUnload() {  
   // 移除监听事件 
   uni.$off('scancodedate')  
}

代码如下:

onUnload() {
// 移除监听事件
uni.$off('scancodedate')
}
onLoad() {  
   var _this = this  
   uni.$on('scancodedate',function(data){  
        // _this 这里面的方法用这个 _this.code(data.code) 
    console.log('你想要的code:', data.code)  
   })  
},  
onUnload() {  
   // 移除监听事件 
   uni.$off('scancodedate')  
}
本作品采用《CC 协议》,转载必须注明作者和本文链接
写代码是一件趣事。
《L05 电商实战》
从零开发一个电商项目,功能包括电商后台、商品 & SKU 管理、购物车、订单管理、支付宝支付、微信支付、订单退款流程、优惠券等
《L04 微信小程序从零到发布》
从小程序个人账户申请开始,带你一步步进行开发一个微信小程序,直到提交微信控制台上线发布。
讨论数量: 0
(= ̄ω ̄=)··· 暂无内容!

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!