zh-cashier-app/pages/index/index.vue

<template>
<view>
  <view>监听到的内容：{{ inputString }}</view>

  <view class="">
    --------------------分割线-----------------------------
  </view>
  
  <view class="">
    {{text}}
  </view>
</view>
</template>

<script>
export default {
  data() {
    return {
      inputString: '',
      inputCache: '',
	  text:'',
    };
  },
  methods: {
    onConfirm(text) {
      console.log('拿到的text', text);
      // 此处写我们自己的逻辑
      this.text = text;
    },
    keypress(e) {
      if (e.keyCode === 66 || e.key === 'Enter') {
        this.inputString = this.inputCache;
        this.onConfirm(this.inputString);
        this.inputCache = '';
      } else {
        this.inputCache += e.key;
      }
    }
  },
  mounted() {
    // #ifdef APP-PLUS
    plus.key.addEventListener("keyup", this.keypress);
    // #endif
    // #ifdef H5
    document.addEventListener("keyup", this.keypress);
    // #endif
  },
  beforeDestroy() {
    // #ifdef APP-PLUS
    plus.key.removeEventListener("keyup", this.keypress);
    // #endif
    // #ifdef H5
    document.removeEventListener("keyup", this.keypress);
    // #endif
  },
  deactivated() {
    // #ifdef APP-PLUS
    plus.key.removeEventListener("keyup", this.keypress);
    // #endif
    // #ifdef H5
    document.removeEventListener("keyup", this.keypress);
    // #endif
  }
};
</script>