fix(table): changing custom scrollbar style to origin

luchunyu · luchunyu · commit ae8fa5451562 · 2019-01-22T16:30:02.000+08:00
diff --git a/src/components/table/index.css b/src/components/table/index.css
@@ -52,12 +52,17 @@
 
 .c-scroll__thead {
   overflow-x: hidden;
+  overflow-y: scroll;
 
   & table {
     table-layout: fixed;
   }
 }
 
+.c-fixtable__left .c-scroll__thead {
+  overflow-y: hidden;
+}
+
 .c-table__body table {
   width: 100%;
   margin: 0;
@@ -68,6 +73,9 @@
 .c-scroll__tbody,
 .c-scrolltable {
   overflow-x: auto;
+  position: relative;
+  -ms-scroll-chaining: none;
+  overscroll-behavior: none;
 
   & table {
     table-layout: fixed;
@@ -177,6 +185,9 @@
 
 .c-table__body {
   overflow-y: auto;
+  position: relative;
+  -ms-scroll-chaining: none;
+  overscroll-behavior: none;
 }
 
 .c-table__all.c-table {
diff --git a/src/components/table/index.vue b/src/components/table/index.vue
@@ -84,6 +84,8 @@ div(:class="className")
           template(v-else)
             +TableWithHeight("fixedRightColumns", "fixedright", "onYscroll", "true")
     template(v-else)
+      .c-scrolltable(@scroll="onScroll")
+        +Table("columns")
       .c-fixtable__left(
         :class="{'c-fixed__leftscroll': isScrollMove}"
         v-if="fixedLeftColumns.length > 0"
@@ -92,8 +94,6 @@ div(:class="className")
           +Table("fixedLeftColumns")
         template(v-else)
           +Table("fixedLeftColumns", "true")
-      .c-scrolltable(@scroll="onScroll")
-        +Table("columns")
       .c-fixtable__right(
         :class="{'c-fixed__rightscroll': isScrollMove}"
         v-if="fixedRightColumns.length > 0"
@@ -300,11 +300,7 @@ export default {
       tbodyEl.style.maxHeight = `${this.height - theadHeight}px`
     },
     getCurrentScrollBarSize () {
-      const ua = window.navigator.userAgent
-      if (ua.indexOf('MSIE') > 0 ||
-        Boolean(ua.match(/Trident.*rv:11./))) {
-        this.scrollBarSize = getScrollBarSize()
-      }
+      this.scrollBarSize = getScrollBarSize()
     },
     rowEnter (index) {
       this.hoverRowIndex = index
@@ -326,7 +322,6 @@ export default {
       scrollEl.scrollTop = e.target.scrollTop
     },
     onScroll (e) {
-      const maxWidth = e.target.scrollWidth - e.target.offsetWidth
       if (!e.target.className.includes(this.scrollBox)) {
         // fix mouseleave but scroll is keeping
         e.target.scrollTop = this.$refs.fixedleft.scrollTop
@@ -343,10 +338,6 @@ export default {
       if (this.$refs.fixedright) {
         this.$refs.fixedright.scrollTop = scrollTop
       }
-      if (scrollLeft > maxWidth) {
-        e.target.scrollLeft = maxWidth
-        return
-      }
       if (scrollEl) {
         scrollEl.scrollLeft = scrollLeft
       }
