diff --git a/src/components/Header.vue b/src/components/Header.vue
index 591bf29..fff26e6 100644
--- a/src/components/Header.vue
+++ b/src/components/Header.vue
@@ -6,7 +6,7 @@ import Avatar from "@/components/Avatar.vue";
import useStore from "@/store";
import { storeToRefs } from "pinia";
const store = useStore();
-const { user } = storeToRefs(store);
+const { user, game } = storeToRefs(store);
const currentPage = computed(() => {
const pages = getCurrentPages();
@@ -59,8 +59,6 @@ const loading = ref(false);
const pointBook = ref(null);
const showProgress = ref(false);
const heat = ref(0);
-/** 当前对战房间的房号,由 battle-room 页面通过 uni.$emit 传入 */
-const battleRoomNumber = ref("");
const updateLoading = (value) => {
loading.value = value;
@@ -70,14 +68,6 @@ const updateHot = (value) => {
heat.value = value;
};
-/**
- * 接收 battle-room 页面发出的房间信息,更新房号展示
- * @param {{ roomNumber: string }} info
- */
-const updateBattleRoomInfo = (info) => {
- battleRoomNumber.value = info.roomNumber || "";
-};
-
onMounted(() => {
const pages = getCurrentPages();
const currentPage = pages[pages.length - 1];
@@ -94,11 +84,9 @@ onMounted(() => {
showProgress.value = true;
}
uni.$on("update-hot", updateHot);
- uni.$on("battle-room-info", updateBattleRoomInfo);
});
onBeforeUnmount(() => {
uni.$off("update-hot", updateHot);
- uni.$off("battle-room-info", updateBattleRoomInfo);
});
@@ -185,14 +173,14 @@ onBeforeUnmount(() => {
-
+
diff --git a/src/pages/battle-room.vue b/src/pages/battle-room.vue
index 4da5bd9..e488ce5 100644
--- a/src/pages/battle-room.vue
+++ b/src/pages/battle-room.vue
@@ -47,6 +47,10 @@ const allReady = ref(false);
const timer = ref(null);
const goBattle = ref(false);
+/**
+ * 从服务端刷新当前房间数据,更新成员列表、准备状态等信息
+ * 仅在 roomNumber 有效且房间未开始时执行
+ */
async function refreshRoomData() {
if (!roomNumber.value) return;
const result = await getRoomAPI(roomNumber.value);
@@ -109,9 +113,6 @@ async function refreshRoomData() {
}
if (timer.value) clearInterval(timer.value);
// timer.value = setTimeout(refreshRoomData, 2000);
-
- // 通知 Header 组件更新房号展示
- uni.$emit("battle-room-info", { roomNumber: roomNumber.value });
}
const startGame = async () => {
@@ -248,19 +249,32 @@ onShareAppMessage(() => {
};
});
+/**
+ * onShow 生命周期:页面显示时刷新房间数据
+ * 注:uni-app 中 onShow 可能早于 onLoad 执行,此时 roomNumber 尚未赋值,
+ * refreshRoomData 会提前 return。
+ */
onShow(() => {
goBattle.value = false;
refreshRoomData();
});
+/**
+ * 页面加载时解析路由参数,初始化房间号
+ * - 存入本地 ref(供页面内部逻辑使用)
+ * - 同步到 Pinia Store(供 Header 组件展示房号胶囊)
+ */
onLoad(async (options) => {
if (options.roomNumber) {
roomNumber.value = options.roomNumber;
- // 立即通知 Header 显示房号,无需等待异步 API 返回
- uni.$emit("battle-room-info", { roomNumber: options.roomNumber });
+ store.updateRoomNumber(options.roomNumber);
}
});
+/**
+ * 组件挂载后:保持屏幕常亮、注册 WebSocket 消息监听
+ * 房间号已通过 onLoad 同步到 Store,Header 从 Store 直接读取,无需额外通知
+ */
onMounted(() => {
uni.setKeepScreenOn({
keepScreenOn: true,
diff --git a/src/store.js b/src/store.js
index 551f0f0..b53daef 100644
--- a/src/store.js
+++ b/src/store.js
@@ -79,6 +79,7 @@ export default defineStore("store", {
game: {
roomID: "",
inBattle: false,
+ roomNumber: "", // 当前房间号,供 Header 展示房号胶囊
},
}),
@@ -135,6 +136,10 @@ export default defineStore("store", {
this.game.roomID = roomID;
this.game.inBattle = inBattle;
},
+ /** 更新当前房间号,供 Header 组件展示房号胶囊 */
+ updateRoomNumber(number) {
+ this.game.roomNumber = number;
+ },
},
// 开启数据持久化