vue3 + uniapp 实现PDA设备的扫码功能

vue3 + uniapp 实现PDA设备的扫码功能

这里必须要用input 不然输入框不能再次聚焦！！！！！！！！
只有input 默认聚焦状态，扫码枪的数据才会默认填入input

<input  class="inputSty" v-model="wuValue" :focus="focusType" @blur="setfocus"    @confirm="searchWu" placeholder="请输入物料条码" placeholder-style="font-size:12px" />

<script setup>	
	import { reactive,ref,nextTick} from "vue";
	import {onLoad,	onShow,	onUnload,onHide,onBackPress} from "@dcloudio/uni-app";
	const focusType=ref(true)
onLoad((val)=>{
		// #ifdef APP-PLUS
		plus.key.addEventListener("keyup", keypress);
		// #endif 
		// #ifdef H5
		document.addEventListener("keyup", keypress);
		// #endif
})
onUnload(()=>{
	    // #ifdef APP-PLUS
	    plus.key.removeEventListener("keyup", keypress);
	    // #endif
	    // #ifdef H5
	    document.removeEventListener("keyup", keypress);
	    // #endif
	})
	onHide(()=>{
	    // #ifdef APP-PLUS
	    plus.key.removeEventListener("keyup", keypress);
	    // #endif
	    // #ifdef H5
	    document.removeEventListener("keyup", keypress);
	    // #endif
	})
	onBackPress(()=>{
	    // #ifdef APP-PLUS
	    plus.key.removeEventListener("keyup", keypress);
	    // #endif
	    // #ifdef H5
	    document.removeEventListener("keyup", keypress);
	    // #endif
	})
//只要操作代码在这里	
	const keypress = (e) => {
		
		console.log(e,"按键码");
		// 102  左侧    103  右侧   104  中间按键
	    if(e.keyCode === 102||e.keyCode === 103 || e.keyCode === 104){
			//这里按键成功
		}
		
		if(e.keyCode == 66){ //enter按键  
			//这里input已经拿到数据了，在这里把拿到的数据，通过接口数据联调起来
			
		}
	}
	//解决焦点自动丢失，无法再次自动聚焦
	const setfocus=()=>{
		focusType.value=false
		nextTick(()=>{
			focusType.value=true
		})
	}
	const searchWu=()=>{
		//这里是调接口，传递数据，等一些列操作
	}

</script>