缓存聊天记录

src/router/index.js

@@ -79,6 +79,7 @@ router.beforeEach(async (to) => {
     // 如果要去的页面会议号于 vuex中的不一样，则清除数据
     if (to.params.meetingId !== store.state.joinUser.meetingId) {
       store.commit("setJoinUser", {});
+      store.commit("setMessagesList", []);
     }
     // 如果参会方式发生更改，则清除数据
     if (
@@ -147,6 +148,7 @@ router.beforeEach(async (to) => {
     // 如果要去的页面会议号于 vuex中的不一样，则清除数据
     if (to.params.meetingId !== store.state.joinUser.meetingId) {
       store.commit("setJoinUser", {});
+      store.commit("setMessagesList", []);
     }
     if (store.state.joinUser.icCard) {
       try {

src/store/index.js

@@ -8,6 +8,9 @@ const store = createStore({
       : {},
     meeting: {},
     meetingSetting: {},
+    messagesList: localStorage.getItem("MESSAGES")
+      ? JSON.parse(localStorage.getItem("MESSAGES"))
+      : [],
     password: "", //参会密码
     joinType: localStorage.getItem("JOINTYPE")
       ? JSON.parse(localStorage.getItem("JOINTYPE"))
@@ -36,6 +39,10 @@ const store = createStore({
     setMeetingSetting(state, data) {
       state.meetingSetting = data;
     },
+    setMessagesList(state, data) {
+      state.messagesList = data;
+      localStorage.setItem("MESSAGES", JSON.stringify(data));
+    },
   },
   actions: {
     // 请求会议信息

src/views/meeting.vue

@@ -559,6 +559,7 @@ const initWebSocket = () => {
         id: uniqueId(),
         time: dayjs().format("YYYY-MM-DD HH:mm:ss"),
       });
+      store.commit("setMessagesList", messages.value);
     }
     // 开始签到时
     else if (data.type === "isStartSign" && route.name === "Meeting") {
@@ -610,6 +611,7 @@ initWebSocket();
 
 // 消息列表
 const messages = ref([]);
+messages.value = store.state.messagesList.map((msg) => msg);
 const sendMessage = (msgObj) => {
   console.log(JSON.stringify(JSON.stringify(msgObj)));
   socket.send(
@@ -621,6 +623,7 @@ const sendMessage = (msgObj) => {
     )
   );
   messages.value.push(msgObj);
+  store.commit("setMessagesList", messages.value);
 };
 
 const examQuestionsList = ref([]);