The specific principle of UNIApp to realize PDA is that the broadcasting mode needs to be enabled on the device side, and the UNIApp side obtains the scanned data by calling methods, so as to control the scanning results on the APP side

1. Set the scanning Settings of the terminal device

  • Set the scan output mode toRadio output; My terminal is atExtended Settings -> Scan Settings -> Output ModeIn the
  • To viewConfiguration of broadcast outputinformation
    • My broadcast output action isnlscan.action.SCANNER_RESULT
    • Extra isSCAN_BARCODE1

PS: Needs to record the broadcast output configurationaction 和 extraInformation, in uniApp you need to have these two parameters

The key code for using action and extra is as follows

   // The 'nlscanc.action.scanner_result' is required to be consistent with the action broadcast on your device
   this.intentFilter.addAction('nlscan.action.SCANNER_RESULT')
   
   // The value of 'SCAN_BARCODE1' is the same as that of action. It must be the same as Extra configured in the broadcast
   let content = intent.getStringExtra('SCAN_BARCODE1'); 
Copy the code

For the complete code, refer to the initScan method of the custom component “PDA-scan”

Create a custom componentpda-scan

<template>
    <view class="content"></view>
</template>

<script>
export default {
    data() {
        return {
            activity: null.receiver: null.intentFilter: null}},created: function(option) {
        this.initScan()
        this.startScan();
    },
    onHide: function() {
        this.stopScan();
    },
    destroyed: function() {
        // When the page exits, you must uninstall the listener, otherwise the next time you come in, it will repeat, resulting in a scan out of more than 2 results /
        this.stopScan();
    },
    methods: {
        initScan() {
            let _this = this;
            this.activity = plus.android.runtimeMainActivity(); / / for the activity
            var IntentFilter = plus.android.importClass('android.content.IntentFilter');
            this.intentFilter = new IntentFilter();
            // The 'nlscanc.action.scanner_result' is required to be consistent with the action broadcast on your device
            this.intentFilter.addAction('nlscan.action.SCANNER_RESULT')
            this.receiver = plus.android.implements('io.dcloud.feature.internal.reflect.BroadcastReceiver', {
                onReceive: function(context, intent) {
                    console.log("intent",intent)
                    plus.android.importClass(intent);
                    // The value of 'SCAN_BARCODE1' is the same as that of action. It must be the same as Extra configured in the broadcast
                    let content = intent.getStringExtra('SCAN_BARCODE1'); 
                    uni.$emit('scancodedate', content)
                }
            });
        },
        startScan() {
            this.activity.registerReceiver(this.receiver, this.intentFilter);
        },
        stopScan() {
            this.activity.unregisterReceiver(this.receiver); }}}</script>
Copy the code

2. Introduce custom componentspda-scan

<template>
    <view>
        <view>The content of your page</view>
        <view v-for="item in content">{{item}}</view>
        <pda-scan></pda-scan>
    </view>
</template>

<script>
import scanCode from '@/components/scan-code/scan-code.vue';
export default {
    components: { scanCode },
    data() {
        return {
            content: []}},onLoad() {
        var _this = this
        uni.$on('scancodedate'.function(content) {
            console.log("The scanned content is :", content)
            _this.content.push(content)
        })
    }
}
</script>
Copy the code

After the completion of the three steps, you only need to start the project, open the existing APP, and directly use the scanning function of the device terminal to get the response.

Note that you want to open a page with a
tag