提交小程序页面重新载入时，全局弹窗订阅丢失问题

src/components/component/alarModel.vue

@@ -637,8 +637,6 @@ export default {
         },
     },
     mounted() {
-        console.log("alarModel mounted111111");
-
         const userId = uni.getStorageSync("userId");
         const topic = `/mps/wx_${userId}/notice`;
         this.unsubscribeFnNotice = MqttService.subscribe(
@@ -676,14 +674,53 @@ export default {
                 console.log("处理后的 CMD 数据:", data);
             },
             (err) => {
-                if (!err) console.log(`✅ 页面B 已订阅 ${topic}`);
+                if (!err) console.log(`✅ 页面组件 已订阅 ${topic}`);
             }
         );
+
+        uni.$on("mqttDataReadyOnce", (client) => {
+            this.unsubscribeFnNotice = MqttService.subscribe(
+                "DATA",
+                topic,
+                (message, msgTopic) => {
+                    console.log(`接收到 ${msgTopic} 消息:`, message);
+                    // 处理消息
+                    const data = JSON.parse(message);
+                    let userId = uni.getStorageSync("userId");
+                    const noticeMatch = /^\/mps\/wx_(.+)\/notice$/;
+                    const match = topic.match(noticeMatch);
+                    if (!match) return;
+                    // 更新页面数据
+                    this.alarmModel = true;
+                    this.clientId = data.clientId;
+                    this.devName = data.devName;
+                    this.sn = data.clientId;
+                    this.eventListId = data.eventListId;
+                    // VOIP 相关逻辑
+                    this.getVoipAuthor(this.clientId, userId);
+                    // 格式化时间
+                    const now = new Date();
+                    this.nowTime = `${now.getFullYear()}-${String(
+                        now.getMonth() + 1
+                    ).padStart(2, "0")}-${String(now.getDate()).padStart(
+                        2,
+                        "0"
+                    )} ${String(now.getHours()).padStart(2, "0")}:${String(
+                        now.getMinutes()
+                    ).padStart(2, "0")}`;
+                    if (!isWmpf) {
+                        this.getVoipDevices();
+                    }
+                    console.log("处理后的 CMD 数据:", data);
+                },
+                (err) => {
+                    if (!err) console.log(`✅ 页面组件 已订阅 ${topic}`);
+                }
+            );
+        });
     },
 
     beforeDestroy() {
-        console.log("alarModel mounted22222");
-
         if (this.unsubscribeFnNotice) {
             this.unsubscribeFnNotice();
             this.unsubscribeFnNotice = null;

src/main.js

@@ -22,19 +22,10 @@ Vue.prototype.$initMqtt = function () {
         console.log("MQTT 初始化失败：缺少 userId");
         return;
     }
-
-    // 连接 CMD
-    // MqttService.connectCmd(userId)
-    //     .then(client => {
-    //         console.log("CMD MQTT 初始化完成", client);
-    //     })
-    //     .catch(err => {
-    //         console.error("CMD MQTT 初始化失败", err);
-    //     });
-
     // 连接 DATA
     MqttService.connectData(userId)
         .then(client => {
+            uni.$emit('mqttDataReadyOnce', this.dataClient);
             console.log("DATA MQTT 初始化完成", client);
         })
         .catch(err => {

src/pages/home/home.vue

@@ -395,18 +395,15 @@ export default {
         this.showModle = false;
         this.isIniTenMinutes = false;
     },
-    onUnload() {},
-
-    onLaunch() {
-        uni.$on("mqttDataReadyOnce", (client) => {
-            this.showModle = true;
-            console.log("showModle", this.showModle);
-        });
-    },
-
-    onUnload() {
-        this.showModle = false;
-    },
+    // onLaunch() {
+    //     uni.$on("mqttDataReadyOnce", (client) => {
+    //         this.showModle = true;
+    //         console.log("showModle", this.showModle);
+    //     });
+    // },
+    // onUnload() {
+    //     this.showModle = false;
+    // },
 
     onShareAppMessage() {
         return {

src/utils/globalMqtt.js

@@ -45,15 +45,12 @@ class MqttService {
 
     // 连接 DATA
     connectData(userId) {
-
         uni.showToast({
             title: "正在连接平台中...",
             icon: "loading",
-            duration: 2000, //持续的时间
+            duration: 1500, //持续的时间
         });
-
         if (this.dataConnected && this.dataClient) {
-            uni.hideToast()
             console.log("DATA MQTT 已连接，复用现有实例");
             return Promise.resolve(this.dataClient);
         }
@@ -117,10 +114,8 @@ class MqttService {
             this.connections.set(brokerName, connection);
 
             client.on('connect', () => {
-                uni.hideToast()
                 console.log(`${brokerName} MQTT 连接成功`);
                 connection.connected = true;
-                uni.$emit('mqttDataReadyOnce', this.dataClient);
                 resolve(client);
             });
 
@@ -148,7 +143,7 @@ class MqttService {
 
             client.on('close', () => {
                 uni.showToast({
-                    title: `mqtt已经断开`,
+                    title: `平台已经断开`,
                     icon: "none",
                     duration: 1500,
                 });