feat: 二次點擊dock欄中的頁面先是回到頂部再重新整理介面

src/contentScripts/views/App.vue

@@ -36,7 +36,7 @@ const pages = { Home, Search, Anime, History, WatchLater, Favorites, Video }
 const mainAppRef = ref<HTMLElement>() as Ref<HTMLElement>
 const mainAppOpacity = ref<number>(0)
 const showTopbarMask = ref<boolean>(false)
-const dynamicComponentKey = ref<number>(Number(new Date()))
+const dynamicComponentKey = ref<string>(`dynamicComponent${Number(new Date())}`)
 
 // const isVideoPage = ref<boolean>(false)
 // const isBilibiliHomePage = ref<boolean>(false)
@@ -165,6 +165,15 @@ onMounted(() => {
 })
 
 function changeActivatePage(pageName: AppPage) {
+  if (activatedPage.value === pageName) {
+    if (activatedPage.value !== AppPage.Search) {
+      if (mainAppRef.value.scrollTop === 0)
+        handleRefresh()
+      else
+        handleBackToTop()
+    }
+    return
+  }
   activatedPage.value = pageName
 }
 
@@ -237,7 +246,9 @@ function setAppWallpaperMaskingOpacity() {
 }
 
 function handleRefresh() {
-  dynamicComponentKey.value = Number(new Date())
+  emitter.emit('pageRefresh')
+  if (activatedPage.value === AppPage.Anime)
+    dynamicComponentKey.value = `dynamicComponent${Number(new Date())}`
 }
 
 function handleBackToTop() {

src/contentScripts/views/Favorites/Favorites.vue

@@ -32,10 +32,17 @@ onMounted(async () => {
     if (!noMoreContent.value)
       getFavoriteResources(selectedCategory.value!.id, ++currentPageNum.value, keyword.value)
   })
+
+  emitter.off('pageRefresh')
+  emitter.on('pageRefresh', async () => {
+    favoriteResources.length = 0
+    handleSearch()
+  })
 })
 
 onUnmounted(() => {
   emitter.off('reachBottom')
+  emitter.off('pageRefresh')
 })
 
 async function getFavoriteCategories() {

src/contentScripts/views/History/History.vue

@@ -19,6 +19,8 @@ const historyStatus = ref<boolean>()
 watch(
   () => keyword.value,
   (newValue, oldValue) => {
+    if (newValue === oldValue)
+      return
     emitter.on('reachBottom', () => {
       if (isLoading.value)
         return
@@ -47,10 +49,17 @@ onMounted(() => {
       else getHistoryList()
     }
   })
+
+  emitter.off('pageRefresh')
+  emitter.on('pageRefresh', async () => {
+    historyList.length = 0
+    getHistoryList()
+  })
 })
 
 onUnmounted(() => {
   emitter.off('reachBottom')
+  emitter.off('pageRefresh')
 })
 
 /**

src/contentScripts/views/Home/Home.vue

@@ -1,11 +1,25 @@
 <script setup lang="ts">
 import RecommendContent from './components/RecommendContent.vue'
+import emitter from '~/utils/mitt'
+
+const recommendContentKey = ref<string>(`recommendContent${Number(new Date())}`)
+
+onMounted(() => {
+  emitter.off('pageRefresh')
+  emitter.on('pageRefresh', async () => {
+    recommendContentKey.value = `recommendContent${Number(new Date())}`
+  })
+})
+
+onUnmounted(() => {
+  emitter.off('pageRefresh')
+})
 </script>
 
 <template>
-  <div>
-    <RecommendContent />
-  </div>
+  <transition name="fade">
+    <RecommendContent :key="recommendContentKey" />
+  </transition>
 </template>
 
 <style scoped lang="scss"></style>

src/contentScripts/views/WatchLater/WatchLater.vue

@@ -4,6 +4,7 @@ import { useI18n } from 'vue-i18n'
 import type { WatchLaterModel } from './types'
 import { getCSRF, openLinkToNewTab, removeHttpFromUrl } from '~/utils/main'
 import { calcCurrentTime } from '~/utils/dataFormatter'
+import emitter from '~/utils/mitt'
 
 const { t } = useI18n()
 
@@ -13,6 +14,16 @@ const watchLaterList = reactive<Array<WatchLaterModel>>([])
 
 onMounted(() => {
   getAllWatchLaterList()
+
+  emitter.off('pageRefresh')
+  emitter.on('pageRefresh', async () => {
+    watchLaterList.length = 0
+    getAllWatchLaterList()
+  })
+})
+
+onUnmounted(() => {
+  emitter.off('pageRefresh')
 })
 
 /**