fix: 三级路由无法缓存BUG

index.html

@@ -31,31 +31,26 @@
     }
 
     .loader {
-      position: relative;
+      --d: 22px;
-      width: 40px;
-      aspect-ratio: 0.577;
-      overflow: hidden;
-      clip-path: polygon(0 0, 100% 100%, 0 100%, 100% 0);
-      animation: l19 2s infinite linear;
-    }
 
-    .loader::before {
+      width: 4px;
-      position: absolute;
+      height: 4px;
-      inset: -150%;
+      color: #25b09b;
-      content: "";
+      border-radius: 50%;
-      background: repeating-conic-gradient(
+      box-shadow:
-        from 30deg,
+        calc(1 * var(--d)) calc(0 * var(--d)) 0 0,
-        #ffabab 0 60deg,
+        calc(0.707 * var(--d)) calc(0.707 * var(--d)) 0 1px,
-        #abe4ff 0 120deg,
+        calc(0 * var(--d)) calc(1 * var(--d)) 0 2px,
-        #ff7373 0 180deg
+        calc(-0.707 * var(--d)) calc(0.707 * var(--d)) 0 3px,
-      );
+        calc(-1 * var(--d)) calc(0 * var(--d)) 0 4px,
-      animation: inherit;
+        calc(-0.707 * var(--d)) calc(-0.707 * var(--d)) 0 5px,
-      animation-direction: reverse;
+        calc(0 * var(--d)) calc(-1 * var(--d)) 0 6px;
+      animation: l27 1s infinite steps(8);
     }
 
-    @keyframes l19 {
+    @keyframes l27 {
       100% {
-        transform: rotate(360deg);
+        transform: rotate(1turn);
       }
     }
   </style>

src/plugins/permission.ts

@@ -16,6 +16,16 @@ export function setupPermission() {
         next({ path: "/" });
         NProgress.done();
       } else {
+        //处理三级目录页面无法缓存BUG
+        if (to.matched && to.matched.length > 2) {
+          for (let i = 0; i < to.matched.length; i++) {
+            const element = to.matched[i];
+            if (element.name === "Operate") {
+              to.matched.splice(i, 1);
+            }
+          }
+        }
+
         const userStore = useUserStore();
         const hasRoles =
           userStore.user.roles && userStore.user.roles.length > 0;

src/views/family/operate/index.vue

@@ -15,6 +15,9 @@
 
 <script setup lang="ts">
 import { useTagsViewStore } from "@/store";
-
+defineOptions({
+  name: "Operate",
+  inheritAttrs: false,
+});
 const cachedViews = computed(() => useTagsViewStore().cachedViews); // 缓存页面集合
 </script>