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
作者
许远航
发布于
2023年06月16日
许可协议