解决keepAlive缓存设置

src/App.vue

@@ -11,8 +11,10 @@ import SongInfo from "./views/common/SongInfo.vue";
 import SongCtrl from "./views/common/SongCtrl.vue";
 import SongStatus from "./views/common/SongStatus.vue";
 import SongProgress from "@/views/common/SongProgress.vue";
+import PlayingList from "@/views/common/PlayingList.vue";
 import pubsub from "pubsub-js";
 import { NConfigProvider, darkTheme } from "naive-ui";
+import router from "./router";
 // import { CloudCircleSharp } from "@vicons/ionicons5";
 
 const store = useStore();
@@ -34,6 +36,8 @@ const store = useStore();
 store.commit("loadSettings");
 store.commit("loadCaches");
 
+router.replace('/discover/recommend')
+
 const showPlaying = ref(false); //是否显示播放列表
 
 //处理route消息
@@ -68,7 +72,6 @@ onUnmounted(() => {
 
 <template>
   <n-config-provider
-    theme
     :theme-overrides="store.state.theme.themeOverrides"
   >
     <div id="wp">
@@ -81,15 +84,33 @@ onUnmounted(() => {
       </div>
       <div id="content">
         <div id="side">
-          <Personal></Personal>
+          <!-- <Personal></Personal> -->
           <MainMenu></MainMenu>
         </div>
         <div id="main">
-          <router-view />
+          <router-view v-slot="{ Component, route }">
+            <keep-alive exclude="FM,Friends">
+              <component :is="Component" />
+            </keep-alive>
+          </router-view>
+          <!-- <router-view v-slot="{ Component, route }">
+            <keep-alive v-if="route.meta.keepAlive">
+              <component :is="Component" />
+            </keep-alive>
+            <component :is="Component" v-else />
+          </router-view> -->
+          <!-- <router-view>
+          </router-view> -->
         </div>
       </div>
-      <div id="wpPlaying" v-show="showPlaying" @click.self="showPlaying = false">
-        <div id="playing"></div>
+      <div
+        id="wpPlayingList"
+        v-show="showPlaying"
+        @click.self="showPlaying = false"
+      >
+        <div id="playingList">
+          <PlayingList />
+        </div>
       </div>
       <div id="footer">
         <div id="songDetail"></div>
@@ -174,23 +195,25 @@ body {
       padding: 6px;
     }
   }
-  #wpPlaying {
+  #wpPlayingList {
     position: absolute;
     left: 0;
     top: 0;
     right: 0;
     bottom: 0;
-    
 
-    #playing {
+    #playingList {
       position: absolute;
       top: 40px;
       right: 0;
       bottom: 64px;
       // left: 0;
-      width: 600px;
+      width: 500px;
       background-color: #f6f6f6;
       z-index: 1000;
+      border: #ddd solid 1px;
+      // border-top-left-radius: 8px;
+      // border-bottom-left-radius: 8px;
     }
   }