Browse Source

fix: 删除滚动支持

xiaoxian521 3 năm trước cách đây
mục cha
commit
c3645fd760
2 tập tin đã thay đổi với 6 bổ sung22 xóa
  1. 0 6
      src/layout/components/tag/index.scss
  2. 6 16
      src/layout/components/tag/index.vue

+ 0 - 6
src/layout/components/tag/index.scss

@@ -124,12 +124,6 @@
         }
       }
     }
-
-    .scrollbar-wrapper {
-      position: absolute;
-      height: 40px;
-      overflow-x: hidden !important;
-    }
   }
 
   .right-button {

+ 6 - 16
src/layout/components/tag/index.vue

@@ -40,12 +40,7 @@ import { useRoute, useRouter } from "vue-router";
 import { handleAliveRoute, delAliveRoutes } from "/@/router";
 import { usePermissionStoreHook } from "/@/store/modules/permission";
 import { toggleClass, removeClass, hasClass } from "/@/utils/operate";
-import {
-  RouteConfigs,
-  relativeStorageType,
-  tagsViewsType,
-  scrollbarDomType
-} from "../../types";
+import { RouteConfigs, relativeStorageType, tagsViewsType } from "../../types";
 
 const route = useRoute();
 const router = useRouter();
@@ -57,11 +52,11 @@ let relativeStorage: relativeStorageType;
 const showTags = ref(storageLocal.getItem("tagsVal") || false);
 const tabDom = templateRef<HTMLElement | null>("tabDom", null);
 const containerDom = templateRef<HTMLElement | null>("containerDom", null);
-const scrollbarDom = templateRef<scrollbarDomType>("scrollbarDom", null);
+const scrollbarDom = templateRef<HTMLElement | null>("scrollbarDom", null);
 
 const handleScroll = (offset: number): void => {
-  const scrollbarDomWidth = scrollbarDom.value?.wrap
-    ? scrollbarDom.value?.wrap.offsetWidth
+  const scrollbarDomWidth = scrollbarDom.value
+    ? scrollbarDom.value?.offsetWidth
     : 0;
   const tabDomWidth = tabDom.value ? tabDom.value.offsetWidth : 0;
   if (offset > 0) {
@@ -498,12 +493,7 @@ onBeforeMount(() => {
 <template>
   <div ref="containerDom" class="tags-view" v-if="!showTags">
     <i class="ri-arrow-left-s-line" @click="handleScroll(200)"></i>
-    <el-scrollbar
-      tag="span"
-      ref="scrollbarDom"
-      wrap-class="scrollbar-wrapper"
-      class="scroll-container"
-    >
+    <div ref="scrollbarDom" class="scroll-container">
       <div
         class="tab"
         ref="tabDom"
@@ -544,7 +534,7 @@ onBeforeMount(() => {
           ></div>
         </div>
       </div>
-    </el-scrollbar>
+    </div>
     <i class="ri-arrow-right-s-line" @click="handleScroll(-200)"></i>
     <!-- 右键菜单按钮 -->
     <transition name="el-zoom-in-top">