2，uniapp功能之—扫码（条形码，二维码）点击扫码或者pda侧边按钮扫码

最近在搞uniapp的项目，所以最近的文章基本上是关于uniapp的。
分享一个自动生成二维码的网址，点击前往
注意 如果扫码和上一个nfc功能在同一个页面里面，会发生冲突，只有一个有用，一个没有用，所有，我给扫码的分装成了一个组件，这样就不会冲突了。
1，在component里面新建一个ScanCode.vue组件

<template><view class="Big"><view id="page"><text v-if="isKeshi" class="nameSty">扫描二维码获取</text><text v-if="!isKeshi" class="nameSty">{{codes}}</text></view></view> </template><script>var main, receiver, filter;var _codeQueryTag = false;export default {name:"nfc",data() {return {codes:'',//codeisKeshi:true,//提示字显影nameStys:false,//动态样式};},created(option) {this.initScan();this.startScan();},onHide() {this.stopScan();},destroyed() {this.stopScan();},methods:{initScan() {let _this = this;main = plus.android.runtimeMainActivity(); //获取activitylet IntentFilter1 = plus.android.importClass('android.content.IntentFilter');filter = new IntentFilter1();filter.addAction("com.seuic.scan"); // 换你的广播动作 receiver = plus.android.implements('io.dcloud.feature.internal.reflect.BroadcastReceiver', {onReceive: function(context, intent) {plus.android.importClass(intent);let code = intent.getStringExtra("scannerdata"); // 换你的广播标签 _this.codes = code;_this.queryCode(code);//传值，去除换行字符_this.$emit("setData",code.replace(/\n/g,""));_this.isKeshi = false;}});},startScan() {main.registerReceiver(receiver, filter);},stopScan() {main.unregisterReceiver(receiver);},queryCode(code) {//防重复 if (_codeQueryTag) return false;_codeQueryTag = true;setTimeout(function() {_codeQueryTag = false;}, 150);let id = code},// 点击扫码，或者直接用pda侧边的扫码按钮扫码都可以实现ScanCode() {let main1 = plus.android.runtimeMainActivity(); //获取acitivitylet Intent = plus.android.importClass("android.content.Intent");let intent2 = new Intent("com.scan.onStartScan");main1.sendBroadcast(intent2);},},} </script><style> .Big{width: 220px; } .nameSty{height: 30px;width: 220px !important;line-height: 30px;font-size: 18px;font-weight: bold;color: #828282 !important; }/deep/.u-size-default,/deep/.uni-input-input{font-size: 18px; } </style>

2，在需要的页面引入

<template><view class="box"><scanCode @setData="getData"></scanCode></view> </template> <script> import scanCode from "../../components/saoma.vue";export default {components: {scanCode},methods: {// 接收扫码的值getData(res){console.log(res)},}} </script>

没了，结束了，是不是很简单呐，如有问题，欢迎留言。
最后：如果此篇博文对您有帮助，还请动动小手点点关注点点赞呐~，谢谢 ~ ~

总结

以上是生活随笔为你收集整理的2，uniapp功能之—扫码（条形码，二维码）点击扫码或者pda侧边按钮扫码的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。