fix: 无法滚动倒底部 (Close #74)

Author: Kerwin

src/views/chat/index.vue

@@ -1,6 +1,6 @@
 <script setup lang='ts'>
 import type { Ref } from 'vue'
-import { computed, defineAsyncComponent, nextTick, onMounted, onUnmounted, ref } from 'vue'
+import { computed, defineAsyncComponent, nextTick, onMounted, onUnmounted, ref, watch } from 'vue'
 import { useRoute } from 'vue-router'
 import { storeToRefs } from 'pinia'
 import type { MessageReactive } from 'naive-ui'
@@ -471,6 +471,16 @@ async function loadMoreMessage(event: any) {
 }
 
 const handleLoadMoreMessage = debounce(loadMoreMessage, 300)
+const handleSyncChat
+  = debounce(() => {
+    // 直接刷 极小概率不请求
+    chatStore.syncChat({ uuid: Number(uuid) } as Chat.History, undefined, () => {
+      firstLoading.value = false
+      scrollToBottom()
+      if (inputRef.value && !isMobile.value)
+        inputRef.value?.focus()
+    })
+  }, 200)
 
 async function handleScroll(event: any) {
   const scrollTop = event.target.scrollTop
@@ -524,15 +534,11 @@ const footerClass = computed(() => {
 
 onMounted(() => {
   firstLoading.value = true
-  debounce(() => {
-    // 直接刷 极小概率不请求
-    chatStore.syncChat({ uuid: Number(uuid) } as Chat.History, undefined, () => {
-      firstLoading.value = false
-      scrollToBottom()
-      if (inputRef.value && !isMobile.value)
-        inputRef.value?.focus()
-    })
-  }, 200)()
+  handleSyncChat()
+})
+
+watch(() => chatStore.active, (newVal, oldVal) => {
+  handleSyncChat()
 })
 
 onUnmounted(() => {

src/views/chat/layout/sider/List.vue

@@ -1,15 +1,12 @@
 <script setup lang='ts'>
 import { computed, onMounted, ref } from 'vue'
 import { NInput, NPopconfirm, NScrollbar, NSpin } from 'naive-ui'
-import { useScroll } from '../../hooks/useScroll'
 import { SvgIcon } from '@/components/common'
 import { useAppStore, useChatStore } from '@/store'
 import { useBasicLayout } from '@/hooks/useBasicLayout'
 import { useAuthStoreWithout } from '@/store/modules/auth'
 import { debounce } from '@/utils/functions/debounce'
 
-const { scrollToBottom } = useScroll()
-
 const { isMobile } = useBasicLayout()
 
 const appStore = useAppStore()
@@ -26,15 +23,9 @@ onMounted(async () => {
 })
 
 async function handleSyncChatRoom() {
-  // if (chatStore.history.length == 1 && chatStore.history[0].title == 'New Chat'
-  //   && chatStore.chat[0].data.length <= 0)
   loadingRoom.value = true
   chatStore.syncHistory(() => {
     loadingRoom.value = false
-    if (chatStore.active) {
-      const uuid = chatStore.active
-      chatStore.syncChat({ uuid } as Chat.History, undefined, scrollToBottom)
-    }
   })
 }