fix: 修复ranking页面大批量warning问题

src/@layouts/components/VerticalNavLayout.vue

@@ -52,7 +52,7 @@ export default defineComponent({
         'main',
         { class: 'layout-page-content' },
         h(Transition, { name: 'fade-slide', mode: 'out-in', appear: true },
-          h('section', { class: 'page-content-container' }, slots.default?.()),
+          () => h('section', { class: 'page-content-container' }, slots.default?.()),
         ),
       )
 

src/components/cards/BangumiPersonCard.vue

@@ -37,7 +37,7 @@ function goPersonDetail() {
 </script>
 
 <template>
-  <VHover v-bind="personProps">
+  <VHover>
     <template #default="hover">
       <VCard
         v-bind="hover.props"

src/components/cards/DoubanPersonCard.vue

@@ -30,7 +30,7 @@ function goPersonDetail() {
 </script>
 
 <template>
-  <VHover v-bind="personProps">
+  <VHover>
     <template #default="hover">
       <VCard
         v-bind="hover.props"

src/components/cards/MediaCard.vue

@@ -166,8 +166,9 @@ async function addSubscribe(season = 0) {
   }
   catch (error) {
     console.error(error)
+  } finally {
+    doneNProgress()
   }
-  doneNProgress()
 }
 
 // 弹出添加订阅提示
@@ -428,7 +429,7 @@ function getYear(airDate: string) {
 </script>
 
 <template>
-  <VHover v-bind="props">
+  <VHover>
     <template #default="hover">
       <VCard
         v-bind="hover.props"

src/components/cards/TmdbPersonCard.vue

@@ -36,7 +36,7 @@ function goPersonDetail() {
 </script>
 
 <template>
-  <VHover v-bind="personProps">
+  <VHover>
     <template #default="hover">
       <VCard
         v-bind="hover.props"
@@ -61,7 +61,6 @@ function goPersonDetail() {
                   }"
                 >
                   <VImg
-                    v-img
                     :src="getPersonImage()"
                     cover
                     @load="isImageLoaded = true"

src/components/slide/SlideView.vue

@@ -1,12 +1,6 @@
 <script lang="ts" setup>
 import SlideViewTitle from '@/components/slide/SlideViewTitle.vue'
 
-// 输入参数
-const props = defineProps({
-  linkurl: String,
-  title: String,
-})
-
 // 元素
 const slideview_content = ref()
 // 分页切换状态
@@ -95,7 +89,7 @@ onActivated(() => {
 <template>
   <div class="flex justify-between mt-3">
     <slot name="title">
-      <SlideViewTitle v-bind="props" />
+      <SlideViewTitle />
     </slot>
     <div v-if="disabled !== 3" class="me-1 d-none d-md-flex">
       <VBtn

src/components/slide/SlideViewTitle.vue

@@ -1,9 +1,7 @@
 <script lang="ts" setup>
 // 输入参数
-const props = defineProps({
-  linkurl: String,
-  title: String,
-})
+const props = inject('rankingPropsKey')
+
 </script>
 
 <template>

src/pages/ranking.vue

@@ -1,85 +1,82 @@
 <script setup lang="ts">
 import MediaCardSlideView from '@/views/discover/MediaCardSlideView.vue'
+
+const viewList = reactive<{apipath: string, linkurl: string, title: string}[]>([
+  {
+    apipath: 'tmdb/trending',
+    linkurl: "/browse/tmdb/trending?title=流行趋势",
+    title: "流行趋势",
+  },
+  {
+     apipath: "douban/showing",
+      linkurl: "/browse/douban/showing?title=正在热映",
+      title: "正在热映"
+  },
+  {
+    apipath: "bangumi/calendar",
+      linkurl: "/browse/bangumi/calendar?title=Bangumi每日放送",
+      title: "Bangumi每日放送"
+  },
+  {
+    apipath: "tmdb/movies",
+      linkurl: "/browse/tmdb/movies?title=热门电影",
+      title: "热门电影"
+  },
+  {
+     apipath: "tmdb/tvs?with_original_language=zh|en|ja|ko",
+      linkurl: "/browse/tmdb/tvs??with_original_language=zh|en|ja|ko&title=热门电视剧",
+      title: "热门电视剧"
+  },
+  {
+    apipath: "douban/movie_hot",
+      linkurl: "/browse/douban/movie_hot?title=热门电影",
+      title: "热门电影"
+  },
+  {
+     apipath: "douban/tv_hot",
+      linkurl: "/browse/douban/tv_hot?title=热门电视剧",
+      title: "热门电视剧"
+  },
+  {
+    apipath: "douban/tv_animation",
+      linkurl: "/browse/douban/tv_animation?title=热门动漫",
+      title: "热门动漫"
+  },
+  {
+    apipath: "douban/movies",
+      linkurl: "/browse/douban/movies?title=最新电影",
+      title: "最新电影"
+  },
+  {
+    apipath: "douban/tvs",
+      linkurl: "/browse/douban/tvs?title=最新电视剧",
+      title: "最新电视剧"
+  },
+  {
+    apipath: "douban/movie_top250",
+      linkurl: "/browse/douban/movie_top250?title=电影TOP250",
+      title: "电影TOP250"
+  },
+  {
+    apipath: "douban/tv_weekly_chinese",
+      linkurl: "/browse/douban/tv_weekly_chinese?title=国产剧集榜",
+      title: "国产剧集榜"
+  },
+  {
+    apipath: "douban/tv_weekly_global",
+      linkurl: "/browse/douban/tv_weekly_global?title=全球剧集榜",
+      title: "全球剧集榜"
+  }
+])
+
 </script>
 
 <template>
   <div>
-    <MediaCardSlideView
-      apipath="tmdb/trending"
-      linkurl="/browse/tmdb/trending?title=流行趋势"
-      title="流行趋势"
-    />
-
-    <MediaCardSlideView
-      apipath="douban/showing"
-      linkurl="/browse/douban/showing?title=正在热映"
-      title="正在热映"
-    />
-
-    <MediaCardSlideView
-      apipath="bangumi/calendar"
-      linkurl="/browse/bangumi/calendar?title=Bangumi每日放送"
-      title="Bangumi每日放送"
-    />
-
-    <MediaCardSlideView
-      apipath="tmdb/movies"
-      linkurl="/browse/tmdb/movies?title=热门电影"
-      title="热门电影"
-    />
-
-    <MediaCardSlideView
-      apipath="tmdb/tvs?with_original_language=zh|en|ja|ko"
-      linkurl="/browse/tmdb/tvs??with_original_language=zh|en|ja|ko&title=热门电视剧"
-      title="热门电视剧"
-    />
-
-    <MediaCardSlideView
-      apipath="douban/movie_hot"
-      linkurl="/browse/douban/movie_hot?title=热门电影"
-      title="热门电影"
-    />
-
-    <MediaCardSlideView
-      apipath="douban/tv_hot"
-      linkurl="/browse/douban/tv_hot?title=热门电视剧"
-      title="热门电视剧"
-    />
-
-    <MediaCardSlideView
-      apipath="douban/tv_animation"
-      linkurl="/browse/douban/tv_animation?title=热门动漫"
-      title="热门动漫"
-    />
-
-    <MediaCardSlideView
-      apipath="douban/movies"
-      linkurl="/browse/douban/movies?title=最新电影"
-      title="最新电影"
-    />
-
-    <MediaCardSlideView
-      apipath="douban/tvs"
-      linkurl="/browse/douban/tvs?title=最新电视剧"
-      title="最新电视剧"
-    />
-
-    <MediaCardSlideView
-      apipath="douban/movie_top250"
-      linkurl="/browse/douban/movie_top250?title=电影TOP250"
-      title="电影TOP250"
-    />
-
-    <MediaCardSlideView
-      apipath="douban/tv_weekly_chinese"
-      linkurl="/browse/douban/tv_weekly_chinese?title=国产剧集榜"
-      title="国产剧集榜"
-    />
-
-    <MediaCardSlideView
-      apipath="douban/tv_weekly_global"
-      linkurl="/browse/douban/tv_weekly_global?title=全球剧集榜"
-      title="全球剧集榜"
+    <MediaCardSlideView 
+      v-for="item in viewList" 
+      :key="item.apipath"
+      v-bind="item"
     />
   </div>
 </template>

src/views/discover/MediaCardSlideView.vue

@@ -11,6 +11,8 @@ const props = defineProps({
   title: String,
 })
 
+provide('rankingPropsKey', reactive({...props}))
+
 // 组件加载完成
 const componentLoaded = ref(false)
 
@@ -39,7 +41,6 @@ onMounted(fetchData)
 <template>
   <SlideView
     v-if="componentLoaded"
-    v-bind="props"
   >
     <template #content>
       <template

src/views/discover/PersonCardSlideView.vue

@@ -13,6 +13,8 @@ const props = defineProps({
   type: String,
 })
 
+provide('rankingPropsKey', reactive({...props}))
+
 // 组件加载完成
 const componentLoaded = ref(false)
 
@@ -41,7 +43,6 @@ onMounted(fetchData)
 <template>
   <SlideView
     v-if="componentLoaded"
-    v-bind="props"
   >
     <template #content>
       <template