fix:优化重新进入比赛页面箭数展示逻辑
This commit is contained in:
@@ -33,8 +33,8 @@ watch(
|
||||
newVal.includes("你")
|
||||
? "轮到你了"
|
||||
: newVal.includes("红队")
|
||||
? "请红方射箭"
|
||||
: "请蓝方射箭"
|
||||
? "请红方射箭"
|
||||
: "请蓝方射箭"
|
||||
);
|
||||
audioManager.play(key, false);
|
||||
currentRoundEnded.value = false;
|
||||
@@ -93,20 +93,22 @@ const onUpdateTips = (newVal) => {
|
||||
tips.value = newVal;
|
||||
};
|
||||
|
||||
const onUpdateTotalShot = (newVal) => {
|
||||
currentShot.value = newVal.currentShot;
|
||||
totalShot.value = newVal.totalShot;
|
||||
};
|
||||
// 监听 Pinia store 中 totalShot 变化,用于比赛恢复时同步箭数(替代 uni.$emit 避免时序问题)
|
||||
// 使用 immediate: true 确保组件创建时立即读取 store 当前值(解决重入时 totalShot 值不变 watch 不触发的问题)
|
||||
watch(() => store.game.totalShot, (newVal) => {
|
||||
if (newVal > 0) {
|
||||
totalShot.value = newVal;
|
||||
currentShot.value = store.game.currentShot;
|
||||
}
|
||||
}, { immediate: true });
|
||||
|
||||
onMounted(() => {
|
||||
uni.$on("update-shot", onUpdateTotalShot);
|
||||
uni.$on("update-tips", onUpdateTips);
|
||||
uni.$on("socket-inbox", onReceiveMessage);
|
||||
uni.$on("play-sound", playSound);
|
||||
});
|
||||
|
||||
onBeforeUnmount(() => {
|
||||
uni.$off("update-shot", onUpdateTotalShot);
|
||||
uni.$off("socket-inbox", onReceiveMessage);
|
||||
uni.$off("play-sound", playSound);
|
||||
if (timer.value) clearInterval(timer.value);
|
||||
@@ -118,10 +120,7 @@ onBeforeUnmount(() => {
|
||||
<text>{{ (tips || "").replace(/你/g, "").replace(/重回/g, "") }}</text>
|
||||
<text v-if="totalShot > 0"> ({{ currentShot }}/{{ totalShot }}) </text>
|
||||
<button v-if="!!tips" hover-class="none" @click="updateSound">
|
||||
<image
|
||||
:src="`../static/sound${sound ? '' : '-off'}-yellow.png`"
|
||||
mode="widthFix"
|
||||
/>
|
||||
<image :src="`../static/sound${sound ? '' : '-off'}-yellow.png`" mode="widthFix" />
|
||||
</button>
|
||||
</view>
|
||||
</template>
|
||||
@@ -135,11 +134,13 @@ onBeforeUnmount(() => {
|
||||
justify-content: center;
|
||||
font-weight: 500;
|
||||
}
|
||||
.container > button:last-child {
|
||||
|
||||
.container>button:last-child {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
}
|
||||
.container > button:last-child > image {
|
||||
|
||||
.container>button:last-child>image {
|
||||
width: 36px;
|
||||
min-height: 36px;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user