102 lines
2.4 KiB
Vue
102 lines
2.4 KiB
Vue
|
<template>
|
|||
|
|
<view class="content">
|
|||
|
|
<view class="uni-title">监听按键扫码结果：</view>
|
|||
|
|
<view class="uni-list">
|
|||
|
|
<view class="uni-cell">
|
|||
|
|
<view class="scan-result">
|
|||
|
|
{{resultCode}}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<form @submit="formSubmit">
|
|||
|
|
<view class="uni-form-item uni-column">
|
|||
|
|
<view class="title">actionKey</view>
|
|||
|
|
<input class="uni-input" name="actionKey" placeholder="请输入actionKey" />
|
|||
|
|
</view>
|
|||
|
|
<view class="uni-form-item uni-column">
|
|||
|
|
<view class="title">codeKey</view>
|
|||
|
|
<input class="uni-input" name="codeKey" placeholder="请输入codeKey" />
|
|||
|
|
</view>
|
|||
|
|
<view class="uni-form-item uni-column">
|
|||
|
|
<view class="title">scanDownKey</view>
|
|||
|
|
<input class="uni-input" name="scanDownKey" placeholder="输入scanDownKey" />
|
|||
|
|
</view>
|
|||
|
|
<view class="uni-btn-v">
|
|||
|
|
<button form-type="submit">提交参数</button>
|
|||
|
|
<button type="default" form-type="reset">重置</button>
|
|||
|
|
</view>
|
|||
|
|
</form>
|
|||
|
|
<view>================= 分割线 =======================</view>
|
|||
|
|
<button type="default" @click="scanCode()">手动触发按键L</button>
|
|||
|
|
|
|||
|
|
<wuli-scan-code v-if="isLoadScan" :customintent="customintent" ref="wlscInst"></wuli-scan-code>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import wuliScanCode from '@/components/wuli-scan-code/index.vue'
|
|||
|
|
export default {
|
|||
|
|
components: {
|
|||
|
|
wuliScanCode
|
|||
|
|
},
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
resultCode: '',
|
|||
|
|
customintent: undefined,
|
|||
|
|
isLoadScan: true
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onLoad() {
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
onUnload() {
|
|||
|
|
// 移除监听事件
|
|||
|
|
uni.$off('wuli-appscan')
|
|||
|
|
},
|
|||
|
|
onShow() {
|
|||
|
|
let that = this
|
|||
|
|
uni.$off('wuli-appscan') // 每次进来先 移除全局自定义事件监听器
|
|||
|
|
uni.$on('wuli-appscan', (res) => {
|
|||
|
|
console.log('扫码结果：', res.code);
|
|||
|
|
this.resultCode = res.code
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
scanCode() {
|
|||
|
|
this.$refs.wlscInst.triggerKeyScan()
|
|||
|
|
},
|
|||
|
|
formSubmit: function(e) {
|
|||
|
|
console.log('form发生了submit事件，携带数据为：' + JSON.stringify(e.detail.value))
|
|||
|
|
//定义表单规则
|
|||
|
|
var rule = [
|
|||
|
|
];
|
|||
|
|
//进行表单检查
|
|||
|
|
var formData = e.detail.value;
|
|||
|
|
this.isLoadScan = false
|
|||
|
|
this.customintent = {
|
|||
|
|
...formData
|
|||
|
|
}
|
|||
|
|
setTimeout(()=> {
|
|||
|
|
this.isLoadScan = true
|
|||
|
|
}, 500)
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style>
|
|||
|
|
.scan-result {
|
|||
|
|
min-height: 50rpx;
|
|||
|
|
line-height: 50rpx;
|
|||
|
|
height: 50rpx;
|
|||
|
|
}
|
|||
|
|
.uni-cell{
|
|||
|
|
min-height: 80rpx;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
.uni-list{
|
|||
|
|
margin-bottom: 30rpx;
|
|||
|
|
}
|
|||
|
|
</style>
|