vue3 add mitt to fix keyboard listener

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"
   },

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)
 				})

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;

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"