升级V3

quoted-ui/src/layout/components/AppMain.vue

@@ -1,45 +1,36 @@
 <template>
   <section class="app-main">
-    <transition name="fade-transform" mode="out-in">
-      <keep-alive :include="cachedViews">
-        <router-view v-if="!$route.meta.link" :key="key" />
-      </keep-alive>
-    </transition>
+    <router-view v-slot="{ Component, route }">
+      <transition name="fade-transform" mode="out-in">
+        <keep-alive :include="tagsViewStore.cachedViews">
+          <component v-if="!route.meta.link" :is="Component" :key="route.path"/>
+        </keep-alive>
+      </transition>
+    </router-view>
     <iframe-toggle />
     <copyright />
   </section>
 </template>
 
-<script>
+<script setup>
 import copyright from "./Copyright/index"
 import iframeToggle from "./IframeToggle/index"
+import useTagsViewStore from '@/store/modules/tagsView'
 
-export default {
-  name: 'AppMain',
-  components: { iframeToggle, copyright },
-  computed: {
-    cachedViews() {
-      return this.$store.state.tagsView.cachedViews
-    },
-    key() {
-      return this.$route.path
-    }
-  },
-  watch: {
-    $route() {
-      this.addIframe()
-    }
-  },
-  mounted() {
-    this.addIframe()
-  },
-  methods: {
-    addIframe() {
-      const { name } = this.$route
-      if (name && this.$route.meta.link) {
-        this.$store.dispatch('tagsView/addIframeView', this.$route)
-      }
-    }
+const route = useRoute()
+const tagsViewStore = useTagsViewStore()
+
+onMounted(() => {
+  addIframe()
+})
+
+watchEffect(() => {
+  addIframe()
+})
+
+function addIframe() {
+  if (route.meta.link) {
+    useTagsViewStore().addIframeView(route)
   }
 }
 </script>
@@ -51,14 +42,6 @@ export default {
   width: 100%;
   position: relative;
   overflow: hidden;
-
-  &:fullscreen,
-  &:-webkit-full-screen,
-  &:-moz-full-screen,
-  &:-ms-fullscreen {
-    background: #fff;
-    overflow-y: auto;
-  }
 }
 
 .fixed-header + .app-main {
@@ -137,4 +120,4 @@ export default {
   background-color: #c0c0c0;
   border-radius: 3px;
 }
-</style>
+</style>