uniapp vue3项目使用qs-scanlistener插件接入pda
由于业务需要,公司采集了pda设备,准备接入uniapp应用进行扫码
在uniapp的插件市场中有支持手机广播方式进行获取扫码内容的组件
但是不支持vue3的语法,所以只能自行改造了
插件名:qs-scanlistener
安装方式就不细说了,按照插件市场的文档来就可以
本地文件路径:
/uni_modules/qs-scanlistener/components/qs-scanlistener/qs-scanlistener.vue
将内容替换成以下代码就可以了
由于我只需要广播模式,所以键盘模式就没测
<template>
<view></view>
</template>
<script setup>
import scaninput from './scanInput.js'
import {
onBeforeMount,
onUnmounted,
ref
} from 'vue'
scaninput.initScan()
scaninput.startScan()
const emit = defineEmits(['scan'])
const inputVal = ref < String > ("")
const scanHandle = (code) => {
emit('scan', code)
}
onBeforeMount(() => {
scaninput.install(scanHandle)
})
onUnmounted(() => {
scaninput.uninstall(scanHandle)
})
const onEvent = (event) => {
// console.log(event.key)
if (event.key != 'Enter' && event.key != 'PrintScreen') { // 拼接输入的值,Enter与PrintScreen是物理按钮要排除
inputVal.value = inputVal.value + event.key
}
if (event.key == 'Enter') {
let reg = new RegExp('Shift', 'g') //g代表全部
let reg2 = new RegExp('Unidentified', 'g') //排除‘Unidentified’字符
let inputVal = inputVal.value
inputVal = inputVal.replace(reg, "")
inputVal = inputVal.replace(reg2, "")
inputVal = inputVal.replace(/\s/g, "")
inputVal = inputVal.replace(/\r\n/g, "")
inputVal = inputVal.replace(/\n/g, "")
if (inputVal.value) {
// console.log('键盘监听模式')
// this.$emit('scan', this.inputVal)
emit('scan', inputVal.value)
}
inputVal.value = ''
}
}
</script>
<style>
</style>
uniapp vue3项目使用qs-scanlistener插件接入pda
http://xuyuanhang.com//archives/uniapp-vue3xiang-mu-shi-yong-qs-scanlistenercha-jian-jie-ru-pda