Browse Source

vue3 add mitt to fix keyboard listener

dev
赵明涛 11 months ago
parent
commit
6aa0a060fb
  1. 1
      uniapp_project_code/package.json
  2. 8
      uniapp_project_code/src/components/index/keyboard/keyboard_listener.vue
  3. 19
      uniapp_project_code/src/components/pay/success.vue
  4. 5
      uniapp_project_code/yarn.lock

1
uniapp_project_code/package.json

@ -54,6 +54,7 @@
"@dcloudio/uni-mp-weixin": "3.0.0-alpha-3090920231215001",
"@dcloudio/uni-mp-xhs": "3.0.0-alpha-3090920231215001",
"@dcloudio/uni-quickapp-webview": "3.0.0-alpha-3090920231215001",
"mitt": "^3.0.1",
"vue": "^3.2.45",
"vue-i18n": "^9.1.9"
},

8
uniapp_project_code/src/components/index/keyboard/keyboard_listener.vue

@ -14,6 +14,7 @@
<script module="keyboard" lang="renderjs">
import { onBeforeUnmount,getCurrentInstance } from 'vue';
import mitt from 'mitt';
export default {
mounted() {
const onKey = (event) => {
@ -38,10 +39,9 @@
// })
// })
// 使 ctx ,vue3
const instance = getCurrentInstance()
const ctx = instance.ctx
ctx.$on('hook:beforeUnmount', () => {
//vue 3.x
const emitter = mitt()
emitter.on('hook:beforeUnmount', () => {
names.forEach(name => {
document.removeEventListener(name, onKey, false)
})

19
uniapp_project_code/src/components/pay/success.vue

@ -20,7 +20,7 @@
</view>
<view class="sc-total">{{paySuccessInfo.amount||'0.00'}}</view>
</view>
<text class="sc-num"> <text>{{paySuccessInfo.goods_data.length}}</text> 件商品</text>
<text class="sc-num"> <text>{{countGoodsNum||'0'}}</text> 件商品</text>
<text class="sc-tip-1">请领取小票期待下次光临</text>
<image class="sc-print-img" src="/static/pay/print-img.png" mode="acepectFit" />
@ -40,7 +40,7 @@
<script setup>
//
import util from "@/utils/util.js"
import { ref,onMounted,onBeforeUnmount,onUnmounted } from 'vue'
import { ref,onMounted,onBeforeUnmount,onUnmounted,computed } from 'vue'
const emits = defineEmits(['clickToIndex'])
const props = defineProps({
paySuccessInfo: {
@ -67,6 +67,15 @@ onUnmounted(() => {
timer = null
})
let countGoodsNum = computed(() => {
let goods_data = props.paySuccessInfo.goods_data
let num = 0;
for (let i = 0; i < goods_data.length; i++) {
num += goods_data[i].nums||1
}
return num
})
function setCountDown() {
clearInterval(timer)
timer = null
@ -84,13 +93,14 @@ const handle_clickToIndex = () => {
emits("clickToIndex", "")
util.routeTo(`/pages/index/standby`, 'rL');
}
</script>
<style lang="scss" scoped>
.success-box {
@include ctf(flex-start);
flex-direction: column;
width: 750rpx;
.s-bg {
width: 750rpx;
height: 772rpx;
@ -107,7 +117,8 @@ const handle_clickToIndex = () => {
z-index: 5;
padding: 11.11rpx 17.36rpx;
height: 79.17rpx;
width: 750rpx;
// width: 750rpx;
width: 90%;
margin-top: 20rpx;
@include ctf(flex-start);
flex-direction: row;

5
uniapp_project_code/yarn.lock

@ -3371,6 +3371,11 @@ minimist@^1.2.6:
resolved "https://registry.npmmirror.com/minimist/-/minimist-1.2.8.tgz#c1a464e7693302e082a075cee0c057741ac4772c"
integrity sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==
mitt@^3.0.1:
version "3.0.1"
resolved "https://registry.npmmirror.com/mitt/-/mitt-3.0.1.tgz#ea36cf0cc30403601ae074c8f77b7092cdab36d1"
integrity sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==
mkdirp@^0.5.1:
version "0.5.6"
resolved "https://registry.npmmirror.com/mkdirp/-/mkdirp-0.5.6.tgz#7def03d2432dcae4ba1d611445c48396062255f6"

Loading…
Cancel
Save