重开一个组件再写当前播放...

src/App.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { h, ref, onMounted, onUnmounted } from "vue";
+import { h, ref, onMounted, onUnmounted, toRaw} from "vue";
 import { useStore } from "vuex";
 import styled from "vue3-styled-components";
 import Nav from "@/views/common/Nav.vue";
@@ -12,8 +12,9 @@ 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 ZPlayingList from "@/views/common/ZPlayingList.vue";
 import pubsub from "pubsub-js";
-import { NConfigProvider, darkTheme } from "naive-ui";
+import { NConfigProvider, darkTheme, NMessageProvider } from "naive-ui";
 import router from "./router";
 // import { CloudCircleSharp } from "@vicons/ionicons5";
 
@@ -75,6 +76,7 @@ onUnmounted(() => {
   <n-config-provider
     :theme-overrides="store.state.theme.themeOverrides"
   >
+  <n-message-provider>
     <div id="wp">
       <!-- <NThemeEditor/> -->
       <div id="top">
@@ -87,6 +89,7 @@ onUnmounted(() => {
         <div id="side">
           <!-- <Personal></Personal> -->
           <MainMenu></MainMenu>
+          
         </div>
         <div id="main">
           <router-view v-slot="{ Component, route }">
@@ -110,7 +113,8 @@ onUnmounted(() => {
         @click.self="showPlaying = false"
       >
         <div id="playingList">
-          <PlayingList />
+          <!-- <PlayingList /> -->
+          <ZPlayingList />
         </div>
       </div>
       <div id="footer">
@@ -125,6 +129,7 @@ onUnmounted(() => {
         </div>
       </div>
     </div>
+    </n-message-provider>
   </n-config-provider>
 </template>