✨ feat(视频组件): 插槽功能测试

@@ -25,8 +25,7 @@
           </van-col>
           </van-col>
         </van-row>
         </van-row>
       </div>
       </div>
-      <div @click="goTo" style="color: #999999; padding: 0px 1rem 0.5rem;">{{ item.kg_name }} ｜ {{ item.localism_type }}
-      </div>
+      <slot name="bookDetailSub"></slot>
     </div>
     </div>
     <div class="audit-module">
     <div class="audit-module">
       
       

@@ -64,7 +64,11 @@
         <van-list v-model:loading="loading" :finished="finished" :finished-text="finishedTextStatus ? '没有更多了' : ''"
         <van-list v-model:loading="loading" :finished="finished" :finished-text="finishedTextStatus ? '没有更多了' : ''"
           @load="onLoad">
           @load="onLoad">
           <template v-for="item in prod_list" :key="item" style="height: 3rem;">
           <template v-for="item in prod_list" :key="item" style="height: 3rem;">
-            <video-card :item="item"></video-card>
+            <video-card :item="item">
+              <template #bookDetailSub>
+                <div @click="goToDetail(item.id, item.book_id, item.type)" style="color: #999999; padding: 0px 1rem 0.5rem;">{{ item.kg_name }} ｜ {{ item.localism_type }} </div>
+              </template>
+            </video-card>
           </template>
           </template>
         </van-list>
         </van-list>
       </div>
       </div>
@@ -241,7 +245,19 @@ const uploadVideo = () => {
 
 
 // TAG: keepAlive 缓存页面
 // TAG: keepAlive 缓存页面
 const store = mainStore();
 const store = mainStore();
-store.keepThisPage($route.meta.name);
+/**
+ * 大菠萝的修改数据方式 3种
+ */
+// 简单数据修改
+// store.keepPages.push($route.meta.name);
+// 多条数据修改
+store.$patch((state) => {
+  state.keepPages = [...state.keepPages, $route.meta.name];
+})
+// 通过action修改
+// store.keepThisPage($route.meta.name);
+// 调用返回其他store的数据
+// store.getTestStoreList
 
 
 onActivated(() => { // keepAlive 重置后执行回调
 onActivated(() => { // keepAlive 重置后执行回调
   // TAG: pinia应用，动态刷新数据
   // TAG: pinia应用，动态刷新数据
@@ -279,8 +295,20 @@ onBeforeRouteLeave(() => {
   store.changeScrollTop(window.scrollY)
   store.changeScrollTop(window.scrollY)
 })
 })
 
 
-/*********************************************************/
+/*****************************************************/
 
 
+/****************** 视频组件相关操作 *******************/
+const goToDetail = (prod_id, book_id, type) => { // 跳转作品详情页
+  $router.push({
+    path: '/client/videoDetail',
+    query: {
+      prod_id,
+      book_id,
+      type // 特殊标识，判断入口 为keepAlive使用
+    }
+  });
+}
+/*****************************************************/
 </script>
 </script>
 
 
 <script>
 <script>