+
+
@@ -214,6 +217,32 @@
const choose = useChooseStore();
const imgExt = ["png", "jpg", "jpeg", "gif", "bmp", "webp", "svg"];
const choosetype = ref("");
+ const scrollbarRef = ref(null);
+ const innerRef = ref(null);
+
+ function scrollToBottom() {
+ store.setScrollToBottom(innerRef, scrollbarRef);
+ }
+
+ // 监听store中的messageSendStatus.value = true,调用scrollToBottom
+ watch(
+ () => store.messageSendStatus,
+ (newVal, _) => {
+ if (newVal) {
+ scrollToBottom();
+ }
+ }
+ );
+
+ // 监听store中的messageReceiveStatus,调用scrollToBottom
+ watch(
+ () => store.messageReceiveStatus,
+ (newVal, _) => {
+ if (newVal) {
+ scrollToBottom();
+ }
+ }
+ );
// 监听store.drawerVisible
watch(
diff --git a/frontend/src/components/chat/ChatMessage.vue b/frontend/src/components/chat/ChatMessage.vue
index a4cf424..3686e76 100644
--- a/frontend/src/components/chat/ChatMessage.vue
+++ b/frontend/src/components/chat/ChatMessage.vue
@@ -6,154 +6,165 @@
:key="item.chatId"
>
-
-
-
-
-
-
- {{ store.userInfo.nickname }}
-
-
-
-
-
-
- {{ item.message }}
-
+ {{ item.message }}
+
+
-
+
+
+
+
+
+
+
+
+ {{ store.userInfo.nickname }}
+
+
+
-
-
-
-
-
-
-
+
+
+
+
+
+ {{ item.message }}
+
+
+
+
+
+
+
+
+
+
+ {{ item.previewTimeFormat }}
+
+
+
+
+
-
-
-
- {{ item.previewTimeFormat }}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{ item.displayName }}
-
-
-
-
-
-
- {{ item.message }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ item.displayName }}
+
+
+
+
+
+
+ {{ item.message }}
+
-
-
-
-
+
+
+
+
+
+
+ {{ item.message }}
+
-
- {{ item.message }}
+
+
+
+
-
-
-
-
+
+
+ {{ item.previewTimeFormat }}
-
-
-
- {{ item.previewTimeFormat }}
-
-
-
-
+
+
+
+
-