From c3645fd76013d66baad9951a4e85a9e3fa0ac20d Mon Sep 17 00:00:00 2001
From: xiaoxian521 <1923740402@qq.com>
Date: Sat, 20 Nov 2021 11:09:52 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E5=88=A0=E9=99=A4=E6=BB=9A=E5=8A=A8?=
 =?UTF-8?q?=E6=94=AF=E6=8C=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layout/components/tag/index.scss |  6 ------
 src/layout/components/tag/index.vue  | 22 ++++++----------------
 2 files changed, 6 insertions(+), 22 deletions(-)

diff --git a/src/layout/components/tag/index.scss b/src/layout/components/tag/index.scss
index 2ada56b7b..8ed5fde32 100644
--- a/src/layout/components/tag/index.scss
+++ b/src/layout/components/tag/index.scss
@@ -124,12 +124,6 @@
         }
       }
     }
-
-    .scrollbar-wrapper {
-      position: absolute;
-      height: 40px;
-      overflow-x: hidden !important;
-    }
   }
 
   .right-button {
diff --git a/src/layout/components/tag/index.vue b/src/layout/components/tag/index.vue
index dbfd86f42..5b811cb4a 100644
--- a/src/layout/components/tag/index.vue
+++ b/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">