vxe-pc-ui 3.20.9 → 3.20.10

package/lib/index.umd.js

@@ -11377,6 +11377,7 @@ __webpack_require__.d(__webpack_exports__, {
   handleCheckInfo: function() { return /* reexport */ handleCheckInfo; },
   hasComponent: function() { return /* reexport */ hasComponent; },
   hasLanguage: function() { return /* reexport */ hasLanguage; },
+  initVScrollbarMixin: function() { return /* reexport */ initVScrollbarMixin; },
   install: function() { return /* reexport */ install; },
   interceptor: function() { return /* reexport */ interceptor; },
   loading: function() { return /* reexport */ components_loading; },
@@ -11635,6 +11636,7 @@ __webpack_require__.d(components_namespaceObject, {
   handleCheckInfo: function() { return handleCheckInfo; },
   hasComponent: function() { return hasComponent; },
   hasLanguage: function() { return hasLanguage; },
+  initVScrollbarMixin: function() { return initVScrollbarMixin; },
   install: function() { return install; },
   interceptor: function() { return interceptor; },
   loading: function() { return components_loading; },
@@ -13397,6 +13399,25 @@ var popperUtils = {
 
 
 
+
+
+var getThumbOffsetSize = scrollbarUtils.getThumbOffsetSize,
+  getThumbSize = scrollbarUtils.getThumbSize,
+  getScrollFromClick = scrollbarUtils.getScrollFromClick,
+  getScrollFromDrag = scrollbarUtils.getScrollFromDrag;
+function getVmInternalData($xeVm) {
+  // 新版本 $xeVm.internalData
+  // 老版本 $xeVm
+  return $xeVm.internalData || $xeVm;
+}
+function getVmReactData($xeVm) {
+  // 新版本 $xeVm.reactData
+  // 老版本 $xeVm
+  return $xeVm.reactData || $xeVm;
+}
+/**
+ * 组件尺寸上下文
+ */
 var sizeMixin = external_commonjs_vue_commonjs2_vue_root_Vue_default().extend({
   inject: {
     $xeSizeInfo: {
@@ -13421,16 +13442,29 @@ var sizeMixin = external_commonjs_vue_commonjs2_vue_root_Vue_default().extend({
     }
   }
 });
+/**
+ * 权限码处理
+ */
+var permissionMixin = external_commonjs_vue_commonjs2_vue_root_Vue_default().extend({
+  computed: {
+    computePermissionInfo: function computePermissionInfo() {
+      return handleCheckInfo(this.permissionCode, this.permissionMethod);
+    }
+  }
+});
+/**
+ * 虚拟滚动条是否启用
+ */
 var vScrollbarMixin = external_commonjs_vue_commonjs2_vue_root_Vue_default().extend({
   inject: {
-    $xeScrollbarInfo: {
+    $xeVmInfo: {
       default: null
     }
   },
   provide: function provide() {
     var _this2 = this;
     return {
-      $xeScrollbarInfo: {
+      $xeVmInfo: {
         getIsVScrollbar: function getIsVScrollbar() {
           return _this2.computeIsVScrollbar;
         }
@@ -13440,22 +13474,194 @@ var vScrollbarMixin = external_commonjs_vue_commonjs2_vue_root_Vue_default().ext
   computed: {
     computeIsVScrollbar: function computeIsVScrollbar() {
       var useScrollbar = this.useScrollbar;
-      var $xeScrollbarInfo = this.$xeScrollbarInfo;
-      return external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isBoolean(useScrollbar) ? useScrollbar : $xeScrollbarInfo ? $xeScrollbarInfo.getIsVScrollbar() : null;
+      var $xeVmInfo = this.$xeVmInfo;
+      return external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isBoolean(useScrollbar) ? useScrollbar : $xeVmInfo ? $xeVmInfo.getIsVScrollbar() : null;
     }
   }
 });
-var permissionMixin = external_commonjs_vue_commonjs2_vue_root_Vue_default().extend({
-  computed: {
-    computePermissionInfo: function computePermissionInfo() {
-      return handleCheckInfo(this.permissionCode, this.permissionMethod);
+var initVScrollbarMixin = external_commonjs_vue_commonjs2_vue_root_Vue_default().extend(Object.assign(Object.assign({}, {}), {
+  methods: {
+    updateThumbSize: function updateThumbSize() {
+      var $xeVm = this;
+      var reactData = getVmReactData($xeVm);
+      var viewEl = $xeVm.getScrollViewElem();
+      if (!viewEl) {
+        return;
+      }
+      if (!viewEl.clientHeight || !viewEl.clientHeight) {
+        return;
+      }
+      var trackXEl = $xeVm.$refs.refTrackXElem;
+      var xThumbWidth = trackXEl ? getThumbSize(viewEl.clientWidth, viewEl.scrollWidth, trackXEl.clientWidth) : 0;
+      var thumbXElem = $xeVm.$refs.refThumbXElem;
+      if (thumbXElem) {
+        thumbXElem.style.width = xThumbWidth + 'px';
+      }
+      reactData.xThumbWidth = xThumbWidth;
+      var trackYEl = $xeVm.$refs.refTrackYElem;
+      var yThumbHeight = trackYEl ? getThumbSize(viewEl.clientHeight, viewEl.scrollHeight, trackYEl.clientHeight) : 0;
+      var thumbYElem = $xeVm.$refs.refThumbYElem;
+      if (thumbYElem) {
+        thumbYElem.style.height = yThumbHeight + 'px';
+      }
+      reactData.yThumbHeight = yThumbHeight;
+    },
+    updateThumbOffset: function updateThumbOffset() {
+      var $xeVm = this;
+      var reactData = getVmReactData($xeVm);
+      var internalData = getVmInternalData($xeVm);
+      var viewEl = $xeVm.getScrollViewElem();
+      if (!viewEl) {
+        return;
+      }
+      if (!viewEl.clientHeight || !viewEl.clientHeight) {
+        return;
+      }
+      var xThumbWidth = reactData.xThumbWidth,
+        yThumbHeight = reactData.yThumbHeight;
+      var trackXEl = $xeVm.$refs.refTrackXElem;
+      var thumbXElem = $xeVm.$refs.refThumbXElem;
+      var xThumbLeft = trackXEl && xThumbWidth ? getThumbOffsetSize(viewEl.scrollLeft, viewEl.clientWidth, viewEl.scrollWidth, trackXEl.clientWidth, xThumbWidth) : 0;
+      internalData.xThumbLeft = xThumbLeft;
+      if (thumbXElem && xThumbWidth) {
+        thumbXElem.style.width = xThumbWidth + 'px';
+        thumbXElem.style.transform = "translateX(".concat(xThumbLeft, "px)");
+      }
+      var trackYEl = $xeVm.$refs.refTrackYElem;
+      var thumbYElem = $xeVm.$refs.refThumbYElem;
+      var yThumbTop = trackYEl && yThumbHeight ? getThumbOffsetSize(viewEl.scrollTop, viewEl.clientHeight, viewEl.scrollHeight, trackYEl.clientHeight, yThumbHeight) : 0;
+      internalData.yThumbTop = yThumbTop;
+      if (thumbYElem && yThumbHeight) {
+        thumbYElem.style.height = yThumbHeight + 'px';
+        thumbYElem.style.transform = "translateY(".concat(yThumbTop, "px)");
+      }
+    },
+    clickTrackXEvent: function clickTrackXEvent(evnt) {
+      var $xeVm = this;
+      var reactData = getVmReactData($xeVm);
+      var trackEl = evnt.currentTarget;
+      if (trackEl !== evnt.target) {
+        return;
+      }
+      var viewEl = $xeVm.getScrollViewElem();
+      if (!viewEl) {
+        return;
+      }
+      var xThumbWidth = reactData.xThumbWidth;
+      var trackRect = trackEl.getBoundingClientRect();
+      viewEl.scrollTo({
+        left: getScrollFromClick(evnt.clientX - trackRect.left, viewEl.clientWidth, viewEl.scrollWidth, trackEl.clientWidth, xThumbWidth),
+        behavior: 'auto'
+      });
+    },
+    clickTrackYEvent: function clickTrackYEvent(evnt) {
+      var $xeVm = this;
+      var reactData = getVmReactData($xeVm);
+      var trackEl = evnt.currentTarget;
+      if (trackEl !== evnt.target) {
+        return;
+      }
+      var viewEl = $xeVm.getScrollViewElem();
+      if (!viewEl) {
+        return;
+      }
+      var yThumbHeight = reactData.yThumbHeight;
+      var trackRect = trackEl.getBoundingClientRect();
+      viewEl.scrollTo({
+        top: getScrollFromClick(evnt.clientY - trackRect.top, viewEl.clientHeight, viewEl.scrollHeight, trackEl.clientHeight, yThumbHeight),
+        behavior: 'auto'
+      });
+    },
+    pointerdownThumbXEvent: function pointerdownThumbXEvent(evnt) {
+      var $xeVm = this;
+      var reactData = getVmReactData($xeVm);
+      var internalData = getVmInternalData($xeVm);
+      var thumbEl = evnt.currentTarget;
+      internalData.isThumbDrag = true;
+      thumbEl.setPointerCapture(evnt.pointerId);
+      var viewEl = $xeVm.getScrollViewElem();
+      if (!viewEl) {
+        return;
+      }
+      var xThumbWidth = reactData.xThumbWidth;
+      var trackEl = thumbEl.parentElement;
+      var trackRect = trackEl.getBoundingClientRect();
+      var pointerPosition = evnt.clientX - trackRect.left;
+      // 记录 thumb 的偏移
+      var thumbOffset = getThumbOffsetSize(viewEl.scrollLeft, viewEl.clientWidth, viewEl.scrollWidth, trackEl.clientWidth, xThumbWidth);
+      internalData.thumbDragOffset = pointerPosition - thumbOffset;
+    },
+    pointermoveThumbXEvent: function pointermoveThumbXEvent(evnt) {
+      var $xeVm = this;
+      var reactData = getVmReactData($xeVm);
+      var internalData = getVmInternalData($xeVm);
+      var isThumbDrag = internalData.isThumbDrag,
+        thumbDragOffset = internalData.thumbDragOffset;
+      if (isThumbDrag) {
+        var viewEl = $xeVm.getScrollViewElem();
+        if (!viewEl) {
+          return;
+        }
+        var xThumbWidth = reactData.xThumbWidth;
+        var thumbEl = evnt.currentTarget;
+        var trackEl = thumbEl.parentElement;
+        var trackRect = trackEl.getBoundingClientRect();
+        // 更新偏移
+        viewEl.scrollLeft = getScrollFromDrag(evnt.clientX - trackRect.left, thumbDragOffset, viewEl.clientWidth, viewEl.scrollWidth, trackEl.clientWidth, xThumbWidth);
+      }
+    },
+    cleatPointerThumbEvent: function cleatPointerThumbEvent(evnt) {
+      var $xeVm = this;
+      var internalData = getVmInternalData($xeVm);
+      var thumbEl = evnt.currentTarget;
+      thumbEl.releasePointerCapture(evnt.pointerId);
+      internalData.isThumbDrag = false;
+    },
+    pointerdownThumbYEvent: function pointerdownThumbYEvent(evnt) {
+      var $xeVm = this;
+      var reactData = getVmReactData($xeVm);
+      var internalData = getVmInternalData($xeVm);
+      var thumbEl = evnt.currentTarget;
+      internalData.isThumbDrag = true;
+      thumbEl.setPointerCapture(evnt.pointerId);
+      var viewEl = $xeVm.getScrollViewElem();
+      if (!viewEl) {
+        return;
+      }
+      var yThumbHeight = reactData.yThumbHeight;
+      var trackEl = thumbEl.parentElement;
+      var trackRect = trackEl.getBoundingClientRect();
+      var pointerPosition = evnt.clientY - trackRect.top;
+      // 记录 thumb 的偏移
+      var thumbOffset = getThumbOffsetSize(viewEl.scrollTop, viewEl.clientHeight, viewEl.scrollHeight, trackEl.clientHeight, yThumbHeight);
+      internalData.thumbDragOffset = pointerPosition - thumbOffset;
+    },
+    pointermoveThumbYEvent: function pointermoveThumbYEvent(evnt) {
+      var $xeVm = this;
+      var reactData = getVmReactData($xeVm);
+      var internalData = getVmInternalData($xeVm);
+      var isThumbDrag = internalData.isThumbDrag,
+        thumbDragOffset = internalData.thumbDragOffset;
+      if (isThumbDrag) {
+        var viewEl = $xeVm.getScrollViewElem();
+        if (!viewEl) {
+          return;
+        }
+        var yThumbHeight = reactData.yThumbHeight;
+        var thumbEl = evnt.currentTarget;
+        var trackEl = thumbEl.parentElement;
+        var trackRect = trackEl.getBoundingClientRect();
+        // 更新偏移
+        viewEl.scrollTop = getScrollFromDrag(evnt.clientY - trackRect.top, thumbDragOffset, viewEl.clientHeight, viewEl.scrollHeight, trackEl.clientHeight, yThumbHeight);
+      }
     }
   }
-});
+}));
 var globalMixins = {
   sizeMixin: sizeMixin,
+  permissionMixin: permissionMixin,
   vScrollbarMixin: vScrollbarMixin,
-  permissionMixin: permissionMixin
+  initVScrollbarMixin: initVScrollbarMixin
 };
 ;// ./node_modules/@vxe-ui/core/es/index.esm.js
 
@@ -13729,7 +13935,7 @@ var es_array_filter = __webpack_require__(2008);
 
 
 var log_log = VxeUI.log;
-var uiVersion = "ui v".concat("3.20.9");
+var uiVersion = "ui v".concat("3.20.10");
 function createComponentLog(name) {
   var tableVersion = VxeUI.tableVersion ? "table v".concat(VxeUI.tableVersion) : '';
   var ganttVersion = VxeUI.ganttVersion ? "gantt v".concat(VxeUI.ganttVersion) : '';
@@ -13749,7 +13955,7 @@ var errLog = log_log.create('error', uiVersion);
 
 
 
-var ui_version = "3.20.9";
+var ui_version = "3.20.10";
 VxeUI.uiVersion = ui_version;
 VxeUI.dynamicApp = dynamicApp;
 function config(options) {
@@ -16874,14 +17080,9 @@ var Loading = VxeLoading;
 var scrollbar_getConfig = VxeUI.getConfig,
   scrollbar_createEvent = VxeUI.createEvent,
   scrollbar_domUtils = VxeUI.domUtils,
-  scrollbar_scrollbarUtils = VxeUI.scrollbarUtils,
   scrollbar_globalResize = VxeUI.globalResize,
   scrollbar_globalEvents = VxeUI.globalEvents,
   scrollbar_renderEmptyElement = VxeUI.renderEmptyElement;
-var getThumbOffsetSize = scrollbar_scrollbarUtils.getThumbOffsetSize,
-  getThumbSize = scrollbar_scrollbarUtils.getThumbSize,
-  getScrollFromClick = scrollbar_scrollbarUtils.getScrollFromClick,
-  getScrollFromDrag = scrollbar_scrollbarUtils.getScrollFromDrag;
 function createReactData() {
   return {
     yThumbHeight: 0,
@@ -16890,7 +17091,7 @@ function createReactData() {
 }
 function createInternalData() {
   return {
-    // resizeObserver: undefined,
+    // scrollObserver: undefined,
     // isThumbDrag: false,
     thumbDragOffset: 0,
     yThumbTop: 0,
@@ -16901,6 +17102,7 @@ function createInternalData() {
 }
 /* harmony default export */ var scrollbar = (/* define-vxe-component start */defineVxeComponent({
   name: 'VxeScrollbar',
+  mixins: [globalMixins.sizeMixin, globalMixins.initVScrollbarMixin],
   props: {
     id: [String, Number],
     viewId: [String, Number],
@@ -16973,6 +17175,12 @@ function createInternalData() {
         return scrollbar_getConfig().scrollbar.viewInnerClassName;
       }
     },
+    size: {
+      type: String,
+      default: function _default() {
+        return scrollbar_getConfig().scrollbar.size || scrollbar_getConfig().size;
+      }
+    },
     /**
      * 已废弃
      * @deprecated
@@ -16998,7 +17206,7 @@ function createInternalData() {
       reFlag: 0
     });
   },
-  computed: {
+  computed: _objectSpread2(_objectSpread2({}, {}), {}, {
     computeWrapperStyle: function computeWrapperStyle() {
       var $xeScrollbar = this;
       var props = $xeScrollbar;
@@ -17083,13 +17291,14 @@ function createInternalData() {
         padding = props.padding;
       var yThumbHeight = reactData.yThumbHeight,
         xThumbWidth = reactData.xThumbWidth;
+      var vSize = $xeScrollbar.computeSize;
       var xToTop = $xeScrollbar.computeXToTop;
       var yToLeft = $xeScrollbar.computeYToLeft;
       var xVisible = $xeScrollbar.computeXVisible;
       var yVisible = $xeScrollbar.computeYVisible;
       var xAutoHide = $xeScrollbar.computeXAutoHide;
       var yAutoHide = $xeScrollbar.computeYAutoHide;
-      return scrollbar_domUtils.buildClass(['vxe-scrollbar', theme ? "theme--".concat(theme) : '', "ov-x--".concat(xVisible === false ? 'hidden' : 'visible'), "ov-y--".concat(yVisible === false ? 'hidden' : 'visible'), "sx-pos--".concat(xToTop ? 'top' : 'bottom'), "sy-pos--".concat(yToLeft ? 'left' : 'right'), native ? 'is--native' : 'is--virtual', className], {
+      return scrollbar_domUtils.buildClass(['vxe-scrollbar', vSize ? "size--".concat(vSize) : '', theme ? "theme--".concat(theme) : '', "ov-x--".concat(xVisible === false ? 'hidden' : 'visible'), "ov-y--".concat(yVisible === false ? 'hidden' : 'visible'), "sx-pos--".concat(xToTop ? 'top' : 'bottom'), "sy-pos--".concat(yToLeft ? 'left' : 'right'), native ? 'is--native' : 'is--virtual', className], {
         'is--padding': padding,
         'ov-x--auto-hide': xAutoHide,
         'ov-y--auto-hide': yAutoHide,
@@ -17129,7 +17338,7 @@ function createInternalData() {
       var yOpts = $xeScrollbar.computeYOpts;
       return yOpts.position === 'left';
     }
-  },
+  }),
   methods: {
     //
     // Method
@@ -17140,12 +17349,12 @@ function createInternalData() {
         $scrollbar: $xeScrollbar
       }, params));
     },
-    getViewElem: function getViewElem() {
+    getScrollViewElem: function getScrollViewElem() {
       var $xeScrollbar = this;
       var viewEl = $xeScrollbar.$refs.refViewElem;
       return viewEl || null;
     },
-    getViewInnerElem: function getViewInnerElem() {
+    getScrollViewInnerElem: function getScrollViewInnerElem() {
       var $xeScrollbar = this;
       var viewInnerEl = $xeScrollbar.$refs.refViewInnerElem;
       return viewInnerEl || null;
@@ -17212,60 +17421,6 @@ function createInternalData() {
       $xeScrollbar.updateThumbOffset();
       return $xeScrollbar.$nextTick();
     },
-    updateThumbSize: function updateThumbSize() {
-      var $xeScrollbar = this;
-      var reactData = $xeScrollbar.reactData;
-      var viewEl = $xeScrollbar.$refs.refViewElem;
-      if (!viewEl) {
-        return;
-      }
-      if (!viewEl.clientHeight || !viewEl.clientHeight) {
-        return;
-      }
-      var trackXEl = $xeScrollbar.$refs.refTrackXElem;
-      var xThumbWidth = trackXEl ? getThumbSize(viewEl.clientWidth, viewEl.scrollWidth, trackXEl.clientWidth) : 0;
-      var thumbXElem = $xeScrollbar.$refs.refThumbXElem;
-      if (thumbXElem) {
-        thumbXElem.style.width = xThumbWidth + 'px';
-      }
-      reactData.xThumbWidth = xThumbWidth;
-      var trackYEl = $xeScrollbar.$refs.refTrackYElem;
-      var yThumbHeight = trackYEl ? getThumbSize(viewEl.clientHeight, viewEl.scrollHeight, trackYEl.clientHeight) : 0;
-      var thumbYElem = $xeScrollbar.$refs.refThumbYElem;
-      if (thumbYElem) {
-        thumbYElem.style.height = yThumbHeight + 'px';
-      }
-      reactData.yThumbHeight = yThumbHeight;
-    },
-    updateThumbOffset: function updateThumbOffset() {
-      var $xeScrollbar = this;
-      var reactData = $xeScrollbar.reactData;
-      var internalData = $xeScrollbar.internalData;
-      var viewEl = $xeScrollbar.$refs.refViewElem;
-      if (!viewEl) {
-        return;
-        // removed by dead control flow
-
-      }
-      var xThumbWidth = reactData.xThumbWidth,
-        yThumbHeight = reactData.yThumbHeight;
-      var trackXEl = $xeScrollbar.$refs.refTrackXElem;
-      var thumbXElem = $xeScrollbar.$refs.refThumbXElem;
-      var xThumbLeft = trackXEl && xThumbWidth ? getThumbOffsetSize(viewEl.scrollLeft, viewEl.clientWidth, viewEl.scrollWidth, trackXEl.clientWidth, xThumbWidth) : 0;
-      internalData.xThumbLeft = xThumbLeft;
-      if (thumbXElem && xThumbWidth) {
-        thumbXElem.style.width = xThumbWidth + 'px';
-        thumbXElem.style.transform = "translateX(".concat(xThumbLeft, "px)");
-      }
-      var trackYEl = $xeScrollbar.$refs.refTrackYElem;
-      var thumbYElem = $xeScrollbar.$refs.refThumbYElem;
-      var yThumbTop = trackYEl && yThumbHeight ? getThumbOffsetSize(viewEl.scrollTop, viewEl.clientHeight, viewEl.scrollHeight, trackYEl.clientHeight, yThumbHeight) : 0;
-      internalData.yThumbTop = yThumbTop;
-      if (thumbYElem && yThumbHeight) {
-        thumbYElem.style.height = yThumbHeight + 'px';
-        thumbYElem.style.transform = "translateY(".concat(yThumbTop, "px)");
-      }
-    },
     scrollEvent: function scrollEvent(evnt) {
       var $xeScrollbar = this;
       var reactData = $xeScrollbar.reactData;
@@ -17348,125 +17503,6 @@ function createInternalData() {
         scrollWidth: scrollWidth
       }, evnt);
     },
-    clickTrackXEvent: function clickTrackXEvent(evnt) {
-      var $xeScrollbar = this;
-      var reactData = $xeScrollbar.reactData;
-      var trackEl = evnt.currentTarget;
-      if (trackEl !== evnt.target) {
-        return;
-      }
-      var viewEl = $xeScrollbar.$refs.refViewElem;
-      if (!viewEl) {
-        return;
-      }
-      var xThumbWidth = reactData.xThumbWidth;
-      var trackRect = trackEl.getBoundingClientRect();
-      viewEl.scrollTo({
-        left: getScrollFromClick(evnt.clientX - trackRect.left, viewEl.clientWidth, viewEl.scrollWidth, trackEl.clientWidth, xThumbWidth),
-        behavior: 'auto'
-      });
-    },
-    clickTrackYEvent: function clickTrackYEvent(evnt) {
-      var $xeScrollbar = this;
-      var reactData = $xeScrollbar.reactData;
-      var trackEl = evnt.currentTarget;
-      if (trackEl !== evnt.target) {
-        return;
-      }
-      var viewEl = $xeScrollbar.$refs.refViewElem;
-      if (!viewEl) {
-        return;
-      }
-      var yThumbHeight = reactData.yThumbHeight;
-      var trackRect = trackEl.getBoundingClientRect();
-      viewEl.scrollTo({
-        top: getScrollFromClick(evnt.clientY - trackRect.top, viewEl.clientHeight, viewEl.scrollHeight, trackEl.clientHeight, yThumbHeight),
-        behavior: 'auto'
-      });
-    },
-    pointerdownThumbXEvent: function pointerdownThumbXEvent(evnt) {
-      var $xeScrollbar = this;
-      var reactData = $xeScrollbar.reactData;
-      var internalData = $xeScrollbar.internalData;
-      var thumbEl = evnt.currentTarget;
-      internalData.isThumbDrag = true;
-      thumbEl.setPointerCapture(evnt.pointerId);
-      var viewEl = $xeScrollbar.$refs.refViewElem;
-      if (!viewEl) {
-        return;
-      }
-      var xThumbWidth = reactData.xThumbWidth;
-      var trackEl = thumbEl.parentElement;
-      var trackRect = trackEl.getBoundingClientRect();
-      var pointerPosition = evnt.clientX - trackRect.left;
-      // 记录 thumb 的偏移
-      var thumbOffset = getThumbOffsetSize(viewEl.scrollLeft, viewEl.clientWidth, viewEl.scrollWidth, trackEl.clientWidth, xThumbWidth);
-      internalData.thumbDragOffset = pointerPosition - thumbOffset;
-    },
-    pointermoveThumbXEvent: function pointermoveThumbXEvent(evnt) {
-      var $xeScrollbar = this;
-      var reactData = $xeScrollbar.reactData;
-      var internalData = $xeScrollbar.internalData;
-      var isThumbDrag = internalData.isThumbDrag,
-        thumbDragOffset = internalData.thumbDragOffset;
-      if (isThumbDrag) {
-        var viewEl = $xeScrollbar.$refs.refViewElem;
-        if (!viewEl) {
-          return;
-        }
-        var xThumbWidth = reactData.xThumbWidth;
-        var thumbEl = evnt.currentTarget;
-        var trackEl = thumbEl.parentElement;
-        var trackRect = trackEl.getBoundingClientRect();
-        // 更新偏移
-        viewEl.scrollLeft = getScrollFromDrag(evnt.clientX - trackRect.left, thumbDragOffset, viewEl.clientWidth, viewEl.scrollWidth, trackEl.clientWidth, xThumbWidth);
-      }
-    },
-    cleatPointerThumbEvent: function cleatPointerThumbEvent(evnt) {
-      var $xeScrollbar = this;
-      var internalData = $xeScrollbar.internalData;
-      var thumbEl = evnt.currentTarget;
-      thumbEl.releasePointerCapture(evnt.pointerId);
-      internalData.isThumbDrag = false;
-    },
-    pointerdownThumbYEvent: function pointerdownThumbYEvent(evnt) {
-      var $xeScrollbar = this;
-      var reactData = $xeScrollbar.reactData;
-      var internalData = $xeScrollbar.internalData;
-      var thumbEl = evnt.currentTarget;
-      internalData.isThumbDrag = true;
-      thumbEl.setPointerCapture(evnt.pointerId);
-      var viewEl = $xeScrollbar.$refs.refViewElem;
-      if (!viewEl) {
-        return;
-      }
-      var yThumbHeight = reactData.yThumbHeight;
-      var trackEl = thumbEl.parentElement;
-      var trackRect = trackEl.getBoundingClientRect();
-      var pointerPosition = evnt.clientY - trackRect.top;
-      // 记录 thumb 的偏移
-      var thumbOffset = getThumbOffsetSize(viewEl.scrollTop, viewEl.clientHeight, viewEl.scrollHeight, trackEl.clientHeight, yThumbHeight);
-      internalData.thumbDragOffset = pointerPosition - thumbOffset;
-    },
-    pointermoveThumbYEvent: function pointermoveThumbYEvent(evnt) {
-      var $xeScrollbar = this;
-      var reactData = $xeScrollbar.reactData;
-      var internalData = $xeScrollbar.internalData;
-      var isThumbDrag = internalData.isThumbDrag,
-        thumbDragOffset = internalData.thumbDragOffset;
-      if (isThumbDrag) {
-        var viewEl = $xeScrollbar.$refs.refViewElem;
-        if (!viewEl) {
-          return;
-        }
-        var yThumbHeight = reactData.yThumbHeight;
-        var thumbEl = evnt.currentTarget;
-        var trackEl = thumbEl.parentElement;
-        var trackRect = trackEl.getBoundingClientRect();
-        // 更新偏移
-        viewEl.scrollTop = getScrollFromDrag(evnt.clientY - trackRect.top, thumbDragOffset, viewEl.clientHeight, viewEl.scrollHeight, trackEl.clientHeight, yThumbHeight);
-      }
-    },
     //
     // Render
     //
@@ -17620,18 +17656,18 @@ function createInternalData() {
     var viewEl = $xeScrollbar.$refs.refViewElem;
     var viewInnerEl = $xeScrollbar.$refs.refViewInnerElem;
     if (autoResize) {
-      var resizeObserver = scrollbar_globalResize.create(function () {
+      var scrollObserver = scrollbar_globalResize.create(function () {
         if (props.autoResize) {
           $xeScrollbar.reFlag++;
         }
       });
       if (viewEl) {
-        resizeObserver.observe(viewEl);
+        scrollObserver.observe(viewEl);
       }
       if (viewInnerEl) {
-        resizeObserver.observe(viewInnerEl);
+        scrollObserver.observe(viewInnerEl);
       }
-      internalData.resizeObserver = resizeObserver;
+      internalData.scrollObserver = scrollObserver;
     }
     $xeScrollbar.reFlag++;
     scrollbar_globalEvents.on($xeScrollbar, 'resize', function () {
@@ -17641,9 +17677,9 @@ function createInternalData() {
   beforeDestroy: function beforeDestroy() {
     var $xeScrollbar = this;
     var internalData = $xeScrollbar.internalData;
-    var resizeObserver = internalData.resizeObserver;
-    if (resizeObserver) {
-      resizeObserver.disconnect();
+    var scrollObserver = internalData.scrollObserver;
+    if (scrollObserver) {
+      scrollObserver.disconnect();
     }
     scrollbar_globalEvents.off($xeScrollbar, 'resize');
   },
@@ -18005,9 +18041,7 @@ function tooltip_createInternalData() {
       return $xeTooltip.updateTipStyle().then(function () {
         return $xeTooltip.updateTipStyle();
       }).then(function () {
-        setTimeout(function () {
-          return $xeTooltip.updateTipStyle();
-        }, 15);
+        return $xeTooltip.updateTipStyle();
       });
     },
     isActived: function isActived() {
@@ -18332,7 +18366,7 @@ function tooltip_createInternalData() {
     var internalData = $xeTooltip.internalData;
     var $scrollbar = $xeTooltip.$refs.contentScrollbar;
     if ($scrollbar) {
-      var viewEl = $scrollbar.getViewElem();
+      var viewEl = $scrollbar.getScrollViewElem();
       if (viewEl) {
         viewEl.addEventListener('wheel', $xeTooltip.wheelEvent, {
           passive: false
@@ -23097,14 +23131,9 @@ var list_getConfig = VxeUI.getConfig,
   list_getIcon = VxeUI.getIcon,
   list_getI18n = VxeUI.getI18n,
   list_domUtils = VxeUI.domUtils,
-  list_scrollbarUtils = VxeUI.scrollbarUtils,
   list_menus = VxeUI.menus,
   list_globalEvents = VxeUI.globalEvents,
   list_globalResize = VxeUI.globalResize;
-var list_getThumbOffsetSize = list_scrollbarUtils.getThumbOffsetSize,
-  list_getThumbSize = list_scrollbarUtils.getThumbSize,
-  list_getScrollFromClick = list_scrollbarUtils.getScrollFromClick,
-  list_getScrollFromDrag = list_scrollbarUtils.getScrollFromDrag;
 var list_createComponentLog = createComponentLog('tree'),
   list_warnLog = list_createComponentLog.warnLog,
   list_errLog = list_createComponentLog.errLog;
@@ -23180,7 +23209,7 @@ function list_createInternalData() {
 }
 /* harmony default export */ var list = (/* define-vxe-component start */defineVxeComponent({
   name: 'VxeList',
-  mixins: [globalMixins.sizeMixin, globalMixins.vScrollbarMixin],
+  mixins: [globalMixins.sizeMixin, globalMixins.vScrollbarMixin, globalMixins.initVScrollbarMixin],
   props: {
     data: Array,
     height: [Number, String],
@@ -23441,6 +23470,11 @@ function list_createInternalData() {
       }
       return [];
     },
+    getScrollViewElem: function getScrollViewElem() {
+      var $xeList = this;
+      var viewEl = $xeList.$refs.refVirtualWrapper;
+      return viewEl || null;
+    },
     getRowId: function getRowId(row) {
       var $xeList = this;
       var keyField = $xeList.computeKeyField;
@@ -25204,188 +25238,6 @@ function list_createInternalData() {
         }
       }
     },
-    updateThumbSize: function updateThumbSize() {
-      var $xeList = this;
-      var reactData = $xeList.reactData;
-      var viewEl = $xeList.$refs.refVirtualWrapper;
-      if (!viewEl) {
-        return;
-      }
-      if (!viewEl.clientHeight || !viewEl.clientHeight) {
-        return;
-      }
-      var trackXEl = $xeList.$refs.refTrackXElem;
-      var xThumbWidth = trackXEl ? list_getThumbSize(viewEl.clientWidth, viewEl.scrollWidth, trackXEl.clientWidth) : 0;
-      var thumbXElem = $xeList.$refs.refThumbXElem;
-      if (thumbXElem) {
-        thumbXElem.style.width = xThumbWidth + 'px';
-      }
-      reactData.xThumbWidth = xThumbWidth;
-      var trackYEl = $xeList.$refs.refTrackYElem;
-      var yThumbHeight = trackYEl ? list_getThumbSize(viewEl.clientHeight, viewEl.scrollHeight, trackYEl.clientHeight) : 0;
-      var thumbYElem = $xeList.$refs.refThumbYElem;
-      if (thumbYElem) {
-        thumbYElem.style.height = yThumbHeight + 'px';
-      }
-      reactData.yThumbHeight = yThumbHeight;
-    },
-    updateThumbOffset: function updateThumbOffset() {
-      var $xeList = this;
-      var reactData = $xeList.reactData;
-      var internalData = $xeList.internalData;
-      var viewEl = $xeList.$refs.refVirtualWrapper;
-      if (!viewEl) {
-        return;
-      }
-      if (!viewEl.clientHeight || !viewEl.clientHeight) {
-        return;
-      }
-      var xThumbWidth = reactData.xThumbWidth,
-        yThumbHeight = reactData.yThumbHeight;
-      var trackXEl = $xeList.$refs.refTrackXElem;
-      var thumbXElem = $xeList.$refs.refThumbXElem;
-      var xThumbLeft = trackXEl && xThumbWidth ? list_getThumbOffsetSize(viewEl.scrollLeft, viewEl.clientWidth, viewEl.scrollWidth, trackXEl.clientWidth, xThumbWidth) : 0;
-      internalData.xThumbLeft = xThumbLeft;
-      if (thumbXElem && xThumbWidth) {
-        thumbXElem.style.width = xThumbWidth + 'px';
-        thumbXElem.style.transform = "translateX(".concat(xThumbLeft, "px)");
-      }
-      var trackYEl = $xeList.$refs.refTrackYElem;
-      var thumbYElem = $xeList.$refs.refThumbYElem;
-      var yThumbTop = trackYEl && yThumbHeight ? list_getThumbOffsetSize(viewEl.scrollTop, viewEl.clientHeight, viewEl.scrollHeight, trackYEl.clientHeight, yThumbHeight) : 0;
-      internalData.yThumbTop = yThumbTop;
-      if (thumbYElem && yThumbHeight) {
-        thumbYElem.style.height = yThumbHeight + 'px';
-        thumbYElem.style.transform = "translateY(".concat(yThumbTop, "px)");
-      }
-    },
-    clickTrackXEvent: function clickTrackXEvent(evnt) {
-      var $xeList = this;
-      var reactData = $xeList.reactData;
-      var trackEl = evnt.currentTarget;
-      if (trackEl !== evnt.target) {
-        return;
-      }
-      var viewEl = $xeList.$refs.refVirtualWrapper;
-      if (!viewEl) {
-        return;
-      }
-      var xThumbWidth = reactData.xThumbWidth;
-      var trackRect = trackEl.getBoundingClientRect();
-      viewEl.scrollTo({
-        left: list_getScrollFromClick(evnt.clientX - trackRect.left, viewEl.clientWidth, viewEl.scrollWidth, trackEl.clientWidth, xThumbWidth),
-        behavior: 'auto'
-      });
-    },
-    clickTrackYEvent: function clickTrackYEvent(evnt) {
-      var $xeList = this;
-      var reactData = $xeList.reactData;
-      var trackEl = evnt.currentTarget;
-      if (trackEl !== evnt.target) {
-        return;
-      }
-      var viewEl = $xeList.$refs.refVirtualWrapper;
-      if (!viewEl) {
-        return;
-      }
-      var yThumbHeight = reactData.yThumbHeight;
-      var trackRect = trackEl.getBoundingClientRect();
-      viewEl.scrollTo({
-        top: list_getScrollFromClick(evnt.clientY - trackRect.top, viewEl.clientHeight, viewEl.scrollHeight, trackEl.clientHeight, yThumbHeight),
-        behavior: 'auto'
-      });
-    },
-    pointerdownThumbXEvent: function pointerdownThumbXEvent(evnt) {
-      var $xeList = this;
-      var reactData = $xeList.reactData;
-      var internalData = $xeList.internalData;
-      var thumbEl = evnt.currentTarget;
-      internalData.isThumbDrag = true;
-      thumbEl.setPointerCapture(evnt.pointerId);
-      var viewEl = $xeList.$refs.refVirtualWrapper;
-      if (!viewEl) {
-        return;
-      }
-      var xThumbWidth = reactData.xThumbWidth;
-      var trackEl = thumbEl.parentElement;
-      var trackRect = trackEl.getBoundingClientRect();
-      var pointerPosition = evnt.clientX - trackRect.left;
-      // 记录 thumb 的偏移
-      var thumbOffset = list_getThumbOffsetSize(viewEl.scrollLeft, viewEl.clientWidth, viewEl.scrollWidth, trackEl.clientWidth, xThumbWidth);
-      internalData.thumbDragOffset = pointerPosition - thumbOffset;
-    },
-    pointermoveThumbXEvent: function pointermoveThumbXEvent(evnt) {
-      var $xeList = this;
-      var reactData = $xeList.reactData;
-      var internalData = $xeList.internalData;
-      var thumbEl = evnt.currentTarget;
-      if (!thumbEl.hasPointerCapture(evnt.pointerId)) {
-        return;
-      }
-      var isThumbDrag = internalData.isThumbDrag,
-        thumbDragOffset = internalData.thumbDragOffset;
-      if (isThumbDrag) {
-        var viewEl = $xeList.$refs.refVirtualWrapper;
-        if (!viewEl) {
-          return;
-        }
-        var xThumbWidth = reactData.xThumbWidth;
-        var _thumbEl = evnt.currentTarget;
-        var trackEl = _thumbEl.parentElement;
-        var trackRect = trackEl.getBoundingClientRect();
-        // 更新偏移
-        viewEl.scrollLeft = list_getScrollFromDrag(evnt.clientX - trackRect.left, thumbDragOffset, viewEl.clientWidth, viewEl.scrollWidth, trackEl.clientWidth, xThumbWidth);
-      }
-    },
-    cleatPointerThumbEvent: function cleatPointerThumbEvent(evnt) {
-      var $xeList = this;
-      var internalData = $xeList.internalData;
-      var thumbEl = evnt.currentTarget;
-      thumbEl.releasePointerCapture(evnt.pointerId);
-      internalData.isThumbDrag = false;
-    },
-    pointerdownThumbYEvent: function pointerdownThumbYEvent(evnt) {
-      var $xeList = this;
-      var reactData = $xeList.reactData;
-      var internalData = $xeList.internalData;
-      var thumbEl = evnt.currentTarget;
-      internalData.isThumbDrag = true;
-      thumbEl.setPointerCapture(evnt.pointerId);
-      var viewEl = $xeList.$refs.refVirtualWrapper;
-      if (!viewEl) {
-        return;
-      }
-      var yThumbHeight = reactData.yThumbHeight;
-      var trackEl = thumbEl.parentElement;
-      var trackRect = trackEl.getBoundingClientRect();
-      var pointerPosition = evnt.clientY - trackRect.top;
-      // 记录 thumb 的偏移
-      var thumbOffset = list_getThumbOffsetSize(viewEl.scrollTop, viewEl.clientHeight, viewEl.scrollHeight, trackEl.clientHeight, yThumbHeight);
-      internalData.thumbDragOffset = pointerPosition - thumbOffset;
-    },
-    pointermoveThumbYEvent: function pointermoveThumbYEvent(evnt) {
-      var $xeList = this;
-      var reactData = $xeList.reactData;
-      var internalData = $xeList.internalData;
-      var thumbEl = evnt.currentTarget;
-      if (!thumbEl.hasPointerCapture(evnt.pointerId)) {
-        return;
-      }
-      var isThumbDrag = internalData.isThumbDrag,
-        thumbDragOffset = internalData.thumbDragOffset;
-      if (isThumbDrag) {
-        var viewEl = $xeList.$refs.refVirtualWrapper;
-        if (!viewEl) {
-          return;
-        }
-        var yThumbHeight = reactData.yThumbHeight;
-        var _thumbEl2 = evnt.currentTarget;
-        var trackEl = _thumbEl2.parentElement;
-        var trackRect = trackEl.getBoundingClientRect();
-        // 更新偏移
-        viewEl.scrollTop = list_getScrollFromDrag(evnt.clientY - trackRect.top, thumbDragOffset, viewEl.clientHeight, viewEl.scrollHeight, trackEl.clientHeight, yThumbHeight);
-      }
-    },
     //
     // Render
     //
@@ -37285,6 +37137,7 @@ var es_array_sort = __webpack_require__(6910);
 
 
 
+
 
 
 var date_panel_createComponentLog = createComponentLog('date-panel'),
@@ -39266,52 +39119,82 @@ var date_panel_createComponentLog = createComponentLog('date-panel'),
       }, dateTimeLabel)]), h('div', {
         ref: 'refInputTimeBody',
         class: 'vxe-date-panel--time-body'
-      }, [h('ul', {
-        class: 'vxe-date-panel--time-hour-list'
-      }, hourList.map(function (item, index) {
-        return h('li', {
-          key: index,
-          class: {
-            'is--disabled': item.disabled,
-            'is--selected': datetimePanelValue && datetimePanelValue.getHours() === item.value
-          },
-          on: {
-            click: function click(evnt) {
-              return $xeDatePanel.dateHourEvent(evnt, item);
-            }
+      }, [h(packages_scrollbar, {
+        class: 'vxe-date-panel--time-hour-list',
+        props: {
+          autoHide: true,
+          viewClassName: 'vxe-date-panel--time-list-view',
+          viewInnerClassName: 'vxe-date-panel--time-list-inner'
+        },
+        scopedSlots: {
+          default: function _default() {
+            return hourList.map(function (item, index) {
+              return h('div', {
+                key: index,
+                class: ['vxe-date-panel--time-item', {
+                  'is--disabled': item.disabled,
+                  'is--selected': datetimePanelValue && datetimePanelValue.getHours() === item.value
+                }],
+                on: {
+                  click: function click(evnt) {
+                    return $xeDatePanel.dateHourEvent(evnt, item);
+                  }
+                }
+              }, item.label);
+            });
           }
-        }, item.label);
-      })), hasTimeMinute ? h('ul', {
-        class: 'vxe-date-panel--time-minute-list'
-      }, minuteList.map(function (item, index) {
-        return h('li', {
-          key: index,
-          class: {
-            'is--disabled': item.disabled,
-            'is--selected': datetimePanelValue && datetimePanelValue.getMinutes() === item.value
-          },
-          on: {
-            click: function click(evnt) {
-              return $xeDatePanel.dateMinuteEvent(evnt, item);
-            }
+        }
+      }), hasTimeMinute ? h(packages_scrollbar, {
+        class: 'vxe-date-panel--time-minute-list',
+        props: {
+          autoHide: true,
+          viewClassName: 'vxe-date-panel--time-list-view',
+          viewInnerClassName: 'vxe-date-panel--time-list-inner'
+        },
+        scopedSlots: {
+          default: function _default() {
+            return minuteList.map(function (item, index) {
+              return h('div', {
+                key: index,
+                class: ['vxe-date-panel--time-item', {
+                  'is--disabled': item.disabled,
+                  'is--selected': datetimePanelValue && datetimePanelValue.getMinutes() === item.value
+                }],
+                on: {
+                  click: function click(evnt) {
+                    return $xeDatePanel.dateMinuteEvent(evnt, item);
+                  }
+                }
+              }, item.label);
+            });
           }
-        }, item.label);
-      })) : renderEmptyElement($xeDatePanel), hasTimeMinute && hasTimeSecond ? h('ul', {
-        class: 'vxe-date-panel--time-second-list'
-      }, secondList.map(function (item, index) {
-        return h('li', {
-          key: index,
-          class: {
-            'is--disabled': item.disabled,
-            'is--selected': datetimePanelValue && datetimePanelValue.getSeconds() === item.value
-          },
-          on: {
-            click: function click(evnt) {
-              return $xeDatePanel.dateSecondEvent(evnt, item);
-            }
+        }
+      }) : renderEmptyElement($xeDatePanel), hasTimeMinute && hasTimeSecond ? h(packages_scrollbar, {
+        class: 'vxe-date-panel--time-second-list',
+        props: {
+          autoHide: true,
+          viewClassName: 'vxe-date-panel--time-list-view',
+          viewInnerClassName: 'vxe-date-panel--time-list-inner'
+        },
+        scopedSlots: {
+          default: function _default() {
+            return secondList.map(function (item, index) {
+              return h('div', {
+                key: index,
+                class: ['vxe-date-panel--time-item', {
+                  'is--disabled': item.disabled,
+                  'is--selected': datetimePanelValue && datetimePanelValue.getSeconds() === item.value
+                }],
+                on: {
+                  click: function click(evnt) {
+                    return $xeDatePanel.dateSecondEvent(evnt, item);
+                  }
+                }
+              }, item.label);
+            });
           }
-        }, item.label);
-      })) : renderEmptyElement($xeDatePanel)])];
+        }
+      }) : renderEmptyElement($xeDatePanel)])];
     },
     renderPickerPanel: function renderPickerPanel(h) {
       var $xeDatePanel = this;
@@ -47348,6 +47231,17 @@ var FormItem = VxeFormItem;
 
 
 
+var icon_picker_getConfig = VxeUI.getConfig,
+  icon_picker_getIcon = VxeUI.getIcon,
+  icon_picker_getI18n = VxeUI.getI18n,
+  icon_picker_baseUtils = VxeUI.baseUtils,
+  icon_picker_globalEvents = VxeUI.globalEvents,
+  icon_picker_createEvent = VxeUI.createEvent,
+  icon_picker_renderer = VxeUI.renderer,
+  icon_picker_globalMixins = VxeUI.globalMixins,
+  icon_picker_GLOBAL_EVENT_KEYS = VxeUI.GLOBAL_EVENT_KEYS,
+  icon_picker_renderEmptyElement = VxeUI.renderEmptyElement;
+var icon_picker_getDefVal = icon_picker_baseUtils.getDefVal;
 function icon_picker_createReactData() {
   return {
     initialized: false,
@@ -47370,7 +47264,7 @@ function icon_picker_createInternalData() {
 }
 /* harmony default export */ var icon_picker = (/* define-vxe-component start */defineVxeComponent({
   name: 'VxeIconPicker',
-  mixins: [globalMixins.sizeMixin],
+  mixins: [icon_picker_globalMixins.sizeMixin, icon_picker_globalMixins.vScrollbarMixin],
   model: {
     prop: 'value',
     event: 'modelValue'
@@ -47382,7 +47276,7 @@ function icon_picker_createInternalData() {
     size: {
       type: String,
       default: function _default() {
-        return getConfig().iconPicker.size || getConfig().size;
+        return icon_picker_getConfig().iconPicker.size || icon_picker_getConfig().size;
       }
     },
     className: [String, Function],
@@ -47395,7 +47289,7 @@ function icon_picker_createInternalData() {
     showIconTitle: {
       type: Boolean,
       default: function _default() {
-        return getConfig().iconPicker.showIconTitle;
+        return icon_picker_getConfig().iconPicker.showIconTitle;
       }
     },
     readonly: {
@@ -47409,7 +47303,7 @@ function icon_picker_createInternalData() {
     filterable: {
       type: Boolean,
       default: function _default() {
-        return getConfig().iconPicker.filterable;
+        return icon_picker_getConfig().iconPicker.filterable;
       }
     },
     filterConfig: Object,
@@ -47419,7 +47313,14 @@ function icon_picker_createInternalData() {
     transfer: {
       type: Boolean,
       default: null
-    }
+    },
+    useScrollbar: {
+      type: Boolean,
+      default: function _default() {
+        return icon_picker_getDefVal(icon_picker_getConfig().iconPicker.useScrollbar, icon_picker_getConfig().useScrollbar);
+      }
+    },
+    scrollbarConfig: Object
   },
   inject: {
     $xeModal: {
@@ -47492,7 +47393,7 @@ function icon_picker_createInternalData() {
         return popupOpts.transfer;
       }
       if (transfer === null) {
-        var globalTransfer = getConfig().iconPicker.transfer;
+        var globalTransfer = icon_picker_getConfig().iconPicker.transfer;
         if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isBoolean(globalTransfer)) {
           return globalTransfer;
         }
@@ -47509,11 +47410,11 @@ function icon_picker_createInternalData() {
       if (placeholder) {
         return getFuncText(placeholder);
       }
-      var globalPlaceholder = getConfig().select.placeholder;
+      var globalPlaceholder = icon_picker_getConfig().select.placeholder;
       if (globalPlaceholder) {
         return getFuncText(globalPlaceholder);
       }
-      return getI18n('vxe.base.pleaseSelect');
+      return icon_picker_getI18n('vxe.base.pleaseSelect');
     },
     computeCurrStyle: function computeCurrStyle() {
       var $xeIconPicker = this;
@@ -47548,7 +47449,7 @@ function icon_picker_createInternalData() {
       var props = $xeIconPicker;
       var icons = props.icons;
       if (!icons || !icons.length) {
-        icons = getConfig().iconPicker.icons || [];
+        icons = icon_picker_getConfig().iconPicker.icons || [];
       }
       return icons.map(function (item) {
         if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isString(item)) {
@@ -47567,12 +47468,12 @@ function icon_picker_createInternalData() {
     computeFilterOpts: function computeFilterOpts() {
       var $xeIconPicker = this;
       var props = $xeIconPicker;
-      return Object.assign({}, getConfig().iconPicker.filterConfig, props.filterConfig);
+      return Object.assign({}, icon_picker_getConfig().iconPicker.filterConfig, props.filterConfig);
     },
     computePopupOpts: function computePopupOpts() {
       var $xeIconPicker = this;
       var props = $xeIconPicker;
-      return Object.assign({}, getConfig().iconPicker.popupConfig, props.popupConfig);
+      return Object.assign({}, icon_picker_getConfig().iconPicker.popupConfig, props.popupConfig);
     },
     computeIconGroupList: function computeIconGroupList() {
       var $xeIconPicker = this;
@@ -47595,7 +47496,7 @@ function icon_picker_createInternalData() {
     //
     dispatchEvent: function dispatchEvent(type, params, evnt) {
       var $xeIconPicker = this;
-      $xeIconPicker.$emit(type, createEvent(evnt, {
+      $xeIconPicker.$emit(type, icon_picker_createEvent(evnt, {
         $iconPicker: $xeIconPicker
       }, params));
     },
@@ -47859,13 +47760,13 @@ function icon_picker_createInternalData() {
       var visiblePanel = reactData.visiblePanel;
       var isDisabled = $xeIconPicker.computeIsDisabled;
       if (!isDisabled) {
-        var isTab = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.TAB);
-        var isEnter = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ENTER);
-        var isEsc = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ESCAPE);
-        var isUpArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_UP);
-        var isDwArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_DOWN);
-        var isDel = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.DELETE);
-        var isSpacebar = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.SPACEBAR);
+        var isTab = icon_picker_globalEvents.hasKey(evnt, icon_picker_GLOBAL_EVENT_KEYS.TAB);
+        var isEnter = icon_picker_globalEvents.hasKey(evnt, icon_picker_GLOBAL_EVENT_KEYS.ENTER);
+        var isEsc = icon_picker_globalEvents.hasKey(evnt, icon_picker_GLOBAL_EVENT_KEYS.ESCAPE);
+        var isUpArrow = icon_picker_globalEvents.hasKey(evnt, icon_picker_GLOBAL_EVENT_KEYS.ARROW_UP);
+        var isDwArrow = icon_picker_globalEvents.hasKey(evnt, icon_picker_GLOBAL_EVENT_KEYS.ARROW_DOWN);
+        var isDel = icon_picker_globalEvents.hasKey(evnt, icon_picker_GLOBAL_EVENT_KEYS.DELETE);
+        var isSpacebar = icon_picker_globalEvents.hasKey(evnt, icon_picker_GLOBAL_EVENT_KEYS.SPACEBAR);
         if (isTab) {
           reactData.isActivated = false;
         }
@@ -47971,7 +47872,7 @@ function icon_picker_createInternalData() {
       if (!iconList.length) {
         return h('div', {
           class: 'vxe-ico-picker--empty-placeholder'
-        }, getI18n('vxe.iconPicker.emptyText'));
+        }, icon_picker_getI18n('vxe.iconPicker.emptyText'));
       }
       return h('div', {
         class: 'vxe-ico-picker--list-wrapper'
@@ -47979,7 +47880,7 @@ function icon_picker_createInternalData() {
         class: 'vxe-ico-picker--list'
       }, iconList.map(function (item) {
         var iconRender = item.iconRender;
-        var compConf = iconRender ? renderer.get(iconRender.name) : null;
+        var compConf = iconRender ? icon_picker_renderer.get(iconRender.name) : null;
         var iconMethod = compConf ? compConf.renderIconPickerOptionIcon : null;
         return h('div', {
           class: ['vxe-ico-picker--item', {
@@ -48004,7 +47905,7 @@ function icon_picker_createInternalData() {
           class: item.icon || ''
         })]), showIconTitle ? h('div', {
           class: 'vxe-ico-picker--item-title'
-        }, "".concat(item.title || '')) : renderEmptyElement($xeIconPicker)])]);
+        }, "".concat(item.title || '')) : icon_picker_renderEmptyElement($xeIconPicker)])]);
       }))]);
     },
     renderIconView: function renderIconView(h) {
@@ -48014,7 +47915,7 @@ function icon_picker_createInternalData() {
       var selectIconItem = $xeIconPicker.computeSelectIconItem;
       if (selectIconItem) {
         var iconRender = selectIconItem.iconRender;
-        var compConf = iconRender ? renderer.get(iconRender.name) : null;
+        var compConf = iconRender ? icon_picker_renderer.get(iconRender.name) : null;
         var oIconMethod = compConf ? compConf.renderIconPickerOptionIcon : null;
         if (oIconMethod && iconRender) {
           return h('div', {
@@ -48090,11 +47991,11 @@ function icon_picker_createInternalData() {
           click: $xeIconPicker.clearEvent
         }
       }, [h('i', {
-        class: getIcon().INPUT_CLEAR
+        class: icon_picker_getIcon().INPUT_CLEAR
       })]), h('div', {
         class: 'vxe-ico-picker--suffix-icon'
       }, [h('i', {
-        class: visiblePanel ? getIcon().ICON_PICKER_OPEN : getIcon().ICON_PICKER_CLOSE
+        class: visiblePanel ? icon_picker_getIcon().ICON_PICKER_OPEN : icon_picker_getIcon().ICON_PICKER_CLOSE
       })])])]), h('div', {
         ref: 'refOptionPanel',
         class: ['vxe-table--ignore-clear vxe-ico-picker--panel', ppClassName ? external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(ppClassName) ? ppClassName({
@@ -48118,8 +48019,8 @@ function icon_picker_createInternalData() {
           clearable: true,
           disabled: false,
           readonly: false,
-          placeholder: getI18n('vxe.iconPicker.search'),
-          prefixIcon: getIcon().INPUT_SEARCH
+          placeholder: icon_picker_getI18n('vxe.iconPicker.search'),
+          prefixIcon: icon_picker_getIcon().INPUT_SEARCH
         },
         on: {
           'model-value': $xeIconPicker.modelSearchEvent,
@@ -48127,7 +48028,7 @@ function icon_picker_createInternalData() {
           change: $xeIconPicker.triggerSearchEvent,
           search: $xeIconPicker.triggerSearchEvent
         }
-      })]) : renderEmptyElement($xeIconPicker), $xeIconPicker.renderIconWrapper(h)]) : renderEmptyElement($xeIconPicker)])]);
+      })]) : icon_picker_renderEmptyElement($xeIconPicker), $xeIconPicker.renderIconWrapper(h)]) : icon_picker_renderEmptyElement($xeIconPicker)])]);
     }
   },
   watch: {
@@ -48148,11 +48049,11 @@ function icon_picker_createInternalData() {
     $xeIconPicker.internalData = icon_picker_createInternalData();
     reactData.selectIcon = "".concat(props.value || '');
     $xeIconPicker.handleData();
-    globalEvents.on($xeIconPicker, 'mousedown', $xeIconPicker.handleGlobalMousedownEvent);
-    globalEvents.on($xeIconPicker, 'keydown', $xeIconPicker.handleGlobalKeydownEvent);
-    globalEvents.on($xeIconPicker, 'blur', $xeIconPicker.handleGlobalBlurEvent);
-    globalEvents.on($xeIconPicker, 'resize', $xeIconPicker.handleGlobalResizeEvent);
-    globalEvents.on($xeIconPicker, 'scroll', $xeIconPicker.handleGlobalScrollEvent);
+    icon_picker_globalEvents.on($xeIconPicker, 'mousedown', $xeIconPicker.handleGlobalMousedownEvent);
+    icon_picker_globalEvents.on($xeIconPicker, 'keydown', $xeIconPicker.handleGlobalKeydownEvent);
+    icon_picker_globalEvents.on($xeIconPicker, 'blur', $xeIconPicker.handleGlobalBlurEvent);
+    icon_picker_globalEvents.on($xeIconPicker, 'resize', $xeIconPicker.handleGlobalResizeEvent);
+    icon_picker_globalEvents.on($xeIconPicker, 'scroll', $xeIconPicker.handleGlobalScrollEvent);
   },
   beforeDestroy: function beforeDestroy() {
     var $xeIconPicker = this;
@@ -48162,11 +48063,11 @@ function icon_picker_createInternalData() {
     if (panelElem && panelElem.parentNode) {
       panelElem.parentNode.removeChild(panelElem);
     }
-    globalEvents.off($xeIconPicker, 'mousedown');
-    globalEvents.off($xeIconPicker, 'keydown');
-    globalEvents.off($xeIconPicker, 'blur');
-    globalEvents.off($xeIconPicker, 'resize');
-    globalEvents.off($xeIconPicker, 'scroll');
+    icon_picker_globalEvents.off($xeIconPicker, 'mousedown');
+    icon_picker_globalEvents.off($xeIconPicker, 'keydown');
+    icon_picker_globalEvents.off($xeIconPicker, 'blur');
+    icon_picker_globalEvents.off($xeIconPicker, 'resize');
+    icon_picker_globalEvents.off($xeIconPicker, 'scroll');
     external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().assign(reactData, icon_picker_createReactData());
     external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().assign(internalData, icon_picker_createInternalData());
   },
@@ -53713,6 +53614,17 @@ var Option = VxeOption;
 
 
 
+var select_getConfig = VxeUI.getConfig,
+  select_getIcon = VxeUI.getIcon,
+  select_getI18n = VxeUI.getI18n,
+  select_baseUtils = VxeUI.baseUtils,
+  select_domUtils = VxeUI.domUtils,
+  select_globalEvents = VxeUI.globalEvents,
+  select_GLOBAL_EVENT_KEYS = VxeUI.GLOBAL_EVENT_KEYS,
+  select_globalResize = VxeUI.globalResize,
+  select_createEvent = VxeUI.createEvent,
+  select_renderEmptyElement = VxeUI.renderEmptyElement;
+var select_getDefVal = select_baseUtils.getDefVal;
 var select_createComponentLog = createComponentLog('select'),
   select_errLog = select_createComponentLog.errLog;
 function isOptionVisible(option) {
@@ -53733,6 +53645,9 @@ function select_createReactData() {
     currentOption: null,
     searchValue: '',
     searchLoading: false,
+    // 滚动条
+    yThumbHeight: 0,
+    xThumbWidth: 0,
     panelIndex: 0,
     panelStyle: {},
     panelPlacement: null,
@@ -53752,8 +53667,14 @@ function select_createInternalData() {
     optGroupKeyMaps: {},
     optFullValMaps: {},
     remoteValMaps: {},
-    lastScrollLeft: 0,
+    // 滚动条
+    // scrollObserver: undefined,
+    // isThumbDrag: false,
+    thumbDragOffset: 0,
+    yThumbTop: 0,
+    xThumbLeft: 0,
     lastScrollTop: 0,
+    lastScrollLeft: 0,
     scrollYStore: {
       startIndex: 0,
       endIndex: 0,
@@ -53767,7 +53688,7 @@ function select_createInternalData() {
 }
 /* harmony default export */ var src_select = (/* define-vxe-component start */defineVxeComponent({
   name: 'VxeSelect',
-  mixins: [globalMixins.sizeMixin],
+  mixins: [globalMixins.sizeMixin, globalMixins.vScrollbarMixin, globalMixins.initVScrollbarMixin],
   model: {
     prop: 'value',
     event: 'modelValue'
@@ -53778,13 +53699,13 @@ function select_createInternalData() {
     emptyValue: {
       type: [String, Number, Boolean, Array],
       default: function _default() {
-        return getConfig().select.emptyValue;
+        return select_getConfig().select.emptyValue;
       }
     },
     clearable: {
       type: Boolean,
       default: function _default() {
-        return getConfig().select.clearable;
+        return select_getConfig().select.clearable;
       }
     },
     placeholder: String,
@@ -53801,14 +53722,14 @@ function select_createInternalData() {
     multiCharOverflow: {
       type: [Number, String],
       default: function _default() {
-        return getConfig().select.multiCharOverflow;
+        return select_getConfig().select.multiCharOverflow;
       }
     },
     prefixIcon: String,
     allowCreate: {
       type: Boolean,
       default: function _default() {
-        return getConfig().select.allowCreate;
+        return select_getConfig().select.allowCreate;
       }
     },
     placement: String,
@@ -53832,14 +53753,14 @@ function select_createInternalData() {
     showRadio: {
       type: Boolean,
       default: function _default() {
-        return getConfig().select.showRadio;
+        return select_getConfig().select.showRadio;
       }
     },
     radioConfig: Object,
     showCheckbox: {
       type: Boolean,
       default: function _default() {
-        return getConfig().select.showCheckedButton;
+        return select_getConfig().select.showCheckedButton;
       }
     },
     checkboxConfig: Object,
@@ -53851,7 +53772,7 @@ function select_createInternalData() {
     size: {
       type: String,
       default: function _default() {
-        return getConfig().select.size || getConfig().size;
+        return select_getConfig().select.size || select_getConfig().size;
       }
     },
     filterable: Boolean,
@@ -53867,37 +53788,37 @@ function select_createInternalData() {
     checkedClosable: {
       type: Boolean,
       default: function _default() {
-        return getConfig().select.checkedClosable;
+        return select_getConfig().select.checkedClosable;
       }
     },
     clearClosable: {
       type: Boolean,
       default: function _default() {
-        return getConfig().select.clearClosable;
+        return select_getConfig().select.clearClosable;
       }
     },
     showCloseButton: {
       type: Boolean,
       default: function _default() {
-        return getConfig().select.showCloseButton;
+        return select_getConfig().select.showCloseButton;
       }
     },
     showTotalButton: {
       type: Boolean,
       default: function _default() {
-        return getConfig().select.showTotalButton;
+        return select_getConfig().select.showTotalButton;
       }
     },
     showCheckedButton: {
       type: Boolean,
       default: function _default() {
-        return getConfig().select.showCheckedButton;
+        return select_getConfig().select.showCheckedButton;
       }
     },
     showClearButton: {
       type: Boolean,
       default: function _default() {
-        return getConfig().select.showClearButton;
+        return select_getConfig().select.showClearButton;
       }
     },
     transfer: {
@@ -53907,6 +53828,13 @@ function select_createInternalData() {
     popupConfig: Object,
     virtualYConfig: Object,
     scrollY: Object,
+    useScrollbar: {
+      type: Boolean,
+      default: function _default() {
+        return select_getDefVal(select_getConfig().select.useScrollbar, select_getConfig().useScrollbar);
+      }
+    },
+    scrollbarConfig: Object,
     /**
      * 已废弃，被 remote-config.queryMethod 替换
      * @deprecated
@@ -53919,7 +53847,7 @@ function select_createInternalData() {
     optionId: {
       type: String,
       default: function _default() {
-        return getConfig().select.optionId;
+        return select_getConfig().select.optionId;
       }
     },
     /**
@@ -53957,7 +53885,9 @@ function select_createInternalData() {
     var reactData = select_createReactData();
     return _objectSpread2(_objectSpread2({}, {}), {}, {
       xID: xID,
-      reactData: reactData
+      reactData: reactData,
+      reLayoutFlag: 0,
+      reScrollFlag: 0
     });
   },
   computed: _objectSpread2(_objectSpread2({}, {}), {}, {
@@ -54001,7 +53931,7 @@ function select_createInternalData() {
         return popupOpts.transfer;
       }
       if (transfer === null) {
-        var globalTransfer = getConfig().select.transfer;
+        var globalTransfer = select_getConfig().select.transfer;
         if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isBoolean(globalTransfer)) {
           return globalTransfer;
         }
@@ -54018,11 +53948,11 @@ function select_createInternalData() {
       if (placeholder) {
         return getFuncText(placeholder);
       }
-      var globalPlaceholder = getConfig().select.placeholder;
+      var globalPlaceholder = select_getConfig().select.placeholder;
       if (globalPlaceholder) {
         return getFuncText(globalPlaceholder);
       }
-      return getI18n('vxe.base.pleaseSelect');
+      return select_getI18n('vxe.base.pleaseSelect');
     },
     computeDefaultOpts: function computeDefaultOpts() {
       var $xeSelect = this;
@@ -54067,37 +53997,37 @@ function select_createInternalData() {
     computePopupOpts: function computePopupOpts() {
       var $xeSelect = this;
       var props = $xeSelect;
-      return Object.assign({}, getConfig().select.popupConfig, props.popupConfig);
+      return Object.assign({}, select_getConfig().select.popupConfig, props.popupConfig);
     },
     computeVirtualYOpts: function computeVirtualYOpts() {
       var $xeSelect = this;
       var props = $xeSelect;
-      return Object.assign({}, getConfig().select.virtualYConfig || getConfig().select.scrollY, props.virtualYConfig || props.scrollY);
+      return Object.assign({}, select_getConfig().select.virtualYConfig || select_getConfig().select.scrollY, props.virtualYConfig || props.scrollY);
     },
     computeRemoteOpts: function computeRemoteOpts() {
       var $xeSelect = this;
       var props = $xeSelect;
-      return Object.assign({}, getConfig().select.remoteConfig, props.remoteConfig);
+      return Object.assign({}, select_getConfig().select.remoteConfig, props.remoteConfig);
     },
     computeFilterOpts: function computeFilterOpts() {
       var $xeSelect = this;
       var props = $xeSelect;
-      return Object.assign({}, getConfig().select.filterConfig, props.filterConfig);
+      return Object.assign({}, select_getConfig().select.filterConfig, props.filterConfig);
     },
     computeOptionOpts: function computeOptionOpts() {
       var $xeSelect = this;
       var props = $xeSelect;
-      return Object.assign({}, getConfig().select.optionConfig, props.optionConfig);
+      return Object.assign({}, select_getConfig().select.optionConfig, props.optionConfig);
     },
     computeRadioOpts: function computeRadioOpts() {
       var $xeSelect = this;
       var props = $xeSelect;
-      return Object.assign({}, getConfig().select.radioConfig, props.radioConfig);
+      return Object.assign({}, select_getConfig().select.radioConfig, props.radioConfig);
     },
     computeCheckboxOpts: function computeCheckboxOpts() {
       var $xeSelect = this;
       var props = $xeSelect;
-      return Object.assign({}, getConfig().select.checkboxConfig, props.checkboxConfig);
+      return Object.assign({}, select_getConfig().select.checkboxConfig, props.checkboxConfig);
     },
     computeIsGroup: function computeIsGroup() {
       var $xeSelect = this;
@@ -54192,6 +54122,83 @@ function select_createInternalData() {
         return "".concat(labels.slice(0, multiMaxCharNum), "...");
       }
       return labels.join(', ');
+    },
+    computeScrollbarOpts: function computeScrollbarOpts() {
+      var $xeSelect = this;
+      var props = $xeSelect;
+      return Object.assign({}, select_getConfig().tree.scrollbarConfig, props.scrollbarConfig);
+    },
+    computeScrollbarXOpts: function computeScrollbarXOpts() {
+      var $xeSelect = this;
+      var scrollbarOpts = $xeSelect.computeScrollbarOpts;
+      return Object.assign({}, select_getConfig().scrollbar.xConfig, scrollbarOpts.xConfig, {
+        visible: false
+      });
+    },
+    computeScrollbarYOpts: function computeScrollbarYOpts() {
+      var $xeSelect = this;
+      var scrollbarOpts = $xeSelect.computeScrollbarOpts;
+      return Object.assign({}, select_getConfig().scrollbar.yConfig, scrollbarOpts.yConfig);
+    },
+    computeScrollXHeight: function computeScrollXHeight() {
+      var $xeSelect = this;
+      var scrollbarOpts = $xeSelect.computeScrollbarOpts;
+      var scrollbarXOpts = $xeSelect.computeScrollbarXOpts;
+      return select_getDefVal(select_getDefVal(scrollbarXOpts.height, scrollbarOpts.height), select_getConfig().scrollbar.height);
+    },
+    computeScrollYWidth: function computeScrollYWidth() {
+      var $xeSelect = this;
+      var scrollbarOpts = $xeSelect.computeScrollbarOpts;
+      var scrollbarYOpts = $xeSelect.computeScrollbarYOpts;
+      return select_getDefVal(select_getDefVal(scrollbarYOpts.width, scrollbarOpts.width), select_getConfig().scrollbar.width);
+    },
+    computeScrollXVisible: function computeScrollXVisible() {
+      var $xeSelect = this;
+      var scrollbarOpts = $xeSelect.computeScrollbarOpts;
+      var scrollbarXOpts = $xeSelect.computeScrollbarXOpts;
+      return select_getDefVal(scrollbarXOpts.visible, scrollbarOpts.visible);
+    },
+    computeScrollYVisible: function computeScrollYVisible() {
+      var $xeSelect = this;
+      var scrollbarOpts = $xeSelect.computeScrollbarOpts;
+      var scrollbarYOpts = $xeSelect.computeScrollbarYOpts;
+      return select_getDefVal(scrollbarYOpts.visible, scrollbarOpts.visible);
+    },
+    computeScrollXAutoHide: function computeScrollXAutoHide() {
+      var $xeSelect = this;
+      var scrollbarOpts = $xeSelect.computeScrollbarOpts;
+      var scrollbarXOpts = $xeSelect.computeScrollbarXOpts;
+      return select_getDefVal(select_getDefVal(scrollbarXOpts.autoHide, scrollbarOpts.autoHide), select_getConfig().scrollbar.autoHide);
+    },
+    computeScrollYAutoHide: function computeScrollYAutoHide() {
+      var $xeSelect = this;
+      var scrollbarOpts = $xeSelect.computeScrollbarOpts;
+      var scrollbarYOpts = $xeSelect.computeScrollbarYOpts;
+      return select_getDefVal(select_getDefVal(scrollbarYOpts.autoHide, scrollbarOpts.autoHide), select_getConfig().scrollbar.autoHide);
+    },
+    computeScrollbarWrapperClss: function computeScrollbarWrapperClss() {
+      var $xeSelect = this;
+      var reactData = $xeSelect.reactData;
+      var yThumbHeight = reactData.yThumbHeight,
+        xThumbWidth = reactData.xThumbWidth;
+      var scrollbarXToTop = $xeSelect.computeScrollbarXToTop;
+      var scrollbarYToLeft = $xeSelect.computeScrollbarYToLeft;
+      var scrollXVisible = $xeSelect.computeScrollXVisible;
+      var scrollYVisible = $xeSelect.computeScrollYVisible;
+      return select_domUtils.buildClass(['vxe-scrollbar is--virtual', "ov-x--".concat(scrollXVisible === false ? 'hidden' : 'visible'), "ov-y--".concat(scrollYVisible === false ? 'hidden' : 'visible'), "sx-pos--".concat(scrollbarXToTop ? 'top' : 'bottom'), "sy-pos--".concat(scrollbarYToLeft ? 'left' : 'right')], {
+        'overflow-y': yThumbHeight,
+        'overflow-x': xThumbWidth
+      });
+    },
+    computeScrollbarXToTop: function computeScrollbarXToTop() {
+      var $xeSelect = this;
+      var scrollbarXOpts = $xeSelect.computeScrollbarXOpts;
+      return scrollbarXOpts.position === 'top';
+    },
+    computeScrollbarYToLeft: function computeScrollbarYToLeft() {
+      var $xeSelect = this;
+      var scrollbarYOpts = $xeSelect.computeScrollbarYOpts;
+      return scrollbarYOpts.position === 'left';
     }
   }),
   methods: {
@@ -54200,7 +54207,7 @@ function select_createInternalData() {
     //
     dispatchEvent: function dispatchEvent(type, params, evnt) {
       var $xeSelect = this;
-      $xeSelect.$emit(type, createEvent(evnt, {
+      $xeSelect.$emit(type, select_createEvent(evnt, {
         $select: $xeSelect
       }, params));
     },
@@ -54220,6 +54227,11 @@ function select_createInternalData() {
         value: value
       }, null);
     },
+    getScrollViewElem: function getScrollViewElem() {
+      var $xeSelect = this;
+      var viewEl = $xeSelect.$refs.refVirtualWrapper;
+      return viewEl || null;
+    },
     isPanelVisible: function isPanelVisible() {
       var $xeSelect = this;
       var reactData = $xeSelect.reactData;
@@ -54693,7 +54705,7 @@ function select_createInternalData() {
           if ($xeSelect.checkMaxLimit(currVlas)) {
             if (VxeUI) {
               VxeUI.modal.message({
-                content: getI18n('vxe.select.overSizeErr', [max]),
+                content: select_getI18n('vxe.select.overSizeErr', [max]),
                 status: 'warning'
               });
             }
@@ -54878,12 +54890,12 @@ function select_createInternalData() {
       var popupOpts = $xeSelect.computePopupOpts;
       var trigger = popupOpts.trigger;
       if (!isDisabled) {
-        var isTab = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.TAB);
-        var isEnter = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ENTER);
-        var isEsc = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ESCAPE);
-        var isUpArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_UP);
-        var isDwArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_DOWN);
-        var isDel = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.DELETE);
+        var isTab = select_globalEvents.hasKey(evnt, select_GLOBAL_EVENT_KEYS.TAB);
+        var isEnter = select_globalEvents.hasKey(evnt, select_GLOBAL_EVENT_KEYS.ENTER);
+        var isEsc = select_globalEvents.hasKey(evnt, select_GLOBAL_EVENT_KEYS.ESCAPE);
+        var isUpArrow = select_globalEvents.hasKey(evnt, select_GLOBAL_EVENT_KEYS.ARROW_UP);
+        var isDwArrow = select_globalEvents.hasKey(evnt, select_GLOBAL_EVENT_KEYS.ARROW_DOWN);
+        var isDel = select_globalEvents.hasKey(evnt, select_GLOBAL_EVENT_KEYS.DELETE);
         if (isTab) {
           reactData.isActivated = false;
         }
@@ -55256,6 +55268,17 @@ function select_createInternalData() {
         }
       });
     },
+    updateScrollbar: function updateScrollbar() {
+      var $xeSelect = this;
+      var isVScrollbar = $xeSelect.computeIsVScrollbar;
+      if (isVScrollbar) {
+        return $xeSelect.$nextTick().then(function () {
+          $xeSelect.updateThumbSize();
+          $xeSelect.updateThumbOffset();
+        });
+      }
+      return Promise.resolve();
+    },
     /**
      * 重新计算列表
      */
@@ -55263,7 +55286,9 @@ function select_createInternalData() {
       var $xeSelect = this;
       var el = $xeSelect.$refs.refElem;
       if (el && el.clientWidth && el.clientHeight) {
-        return $xeSelect.computeScrollLoad();
+        return $xeSelect.computeScrollLoad().then(function () {
+          return $xeSelect.updateScrollbar();
+        });
       }
       return Promise.resolve();
     },
@@ -55304,6 +55329,7 @@ function select_createInternalData() {
       var scrollBodyElem = evnt.target;
       var scrollTop = scrollBodyElem.scrollTop;
       var scrollLeft = scrollBodyElem.scrollLeft;
+      $xeSelect.updateThumbOffset();
       var isX = scrollLeft !== internalData.lastScrollLeft;
       var isY = scrollTop !== internalData.lastScrollTop;
       internalData.lastScrollTop = scrollTop;
@@ -55400,6 +55426,29 @@ function select_createInternalData() {
       var optGroupKeyMaps = internalData.optGroupKeyMaps;
       return !!optGroupKeyMaps[optid];
     },
+    // 滚动条
+    bindScrollbarResize: function bindScrollbarResize() {
+      var $xeSelect = this;
+      var internalData = $xeSelect.internalData;
+      var isVScrollbar = $xeSelect.computeIsVScrollbar;
+      var scrollObserver = internalData.scrollObserver;
+      if (isVScrollbar) {
+        if (!scrollObserver) {
+          var el = $xeSelect.$refs.refElem;
+          var viewInnerEl = $xeSelect.$refs.refVirtualSpaceElem;
+          var _scrollObserver = select_globalResize.create(function () {
+            $xeSelect.reScrollFlag++;
+          });
+          if (el) {
+            _scrollObserver.observe(el);
+          }
+          if (viewInnerEl) {
+            _scrollObserver.observe(viewInnerEl);
+          }
+          internalData.scrollObserver = _scrollObserver;
+        }
+      }
+    },
     //
     // Render
     //
@@ -55409,7 +55458,7 @@ function select_createInternalData() {
       var showIcon = radioOpts.showIcon,
         trigger = radioOpts.trigger;
       if (isOptGroup || showIcon === false) {
-        return renderEmptyElement($xeSelect);
+        return select_renderEmptyElement($xeSelect);
       }
       var ons = {};
       if (!trigger || trigger === 'default') {
@@ -55427,7 +55476,7 @@ function select_createInternalData() {
         }],
         on: ons
       }, [h('span', {
-        class: ['vxe-radio--icon', isChecked ? getIcon().RADIO_CHECKED : isDisabled ? getIcon().RADIO_DISABLED_UNCHECKED : getIcon().RADIO_UNCHECKED]
+        class: ['vxe-radio--icon', isChecked ? select_getIcon().RADIO_CHECKED : isDisabled ? select_getIcon().RADIO_DISABLED_UNCHECKED : select_getIcon().RADIO_UNCHECKED]
       })]);
     },
     renderCheckbox: function renderCheckbox(h, option, isOptGroup, isChecked, isDisabled) {
@@ -55436,7 +55485,7 @@ function select_createInternalData() {
       var showIcon = checkboxOpts.showIcon,
         trigger = checkboxOpts.trigger;
       if (isOptGroup || showIcon === false) {
-        return renderEmptyElement($xeSelect);
+        return select_renderEmptyElement($xeSelect);
       }
       var ons = {};
       if (!trigger || trigger === 'default') {
@@ -55454,7 +55503,7 @@ function select_createInternalData() {
         }],
         on: ons
       }, [h('span', {
-        class: ['vxe-checkbox--icon', isChecked ? getIcon().CHECKBOX_CHECKED : isDisabled ? getIcon().CHECKBOX_DISABLED_UNCHECKED : getIcon().CHECKBOX_UNCHECKED]
+        class: ['vxe-checkbox--icon', isChecked ? select_getIcon().CHECKBOX_CHECKED : isDisabled ? select_getIcon().CHECKBOX_DISABLED_UNCHECKED : select_getIcon().CHECKBOX_UNCHECKED]
       })]);
     },
     renderOption: function renderOption(h, list) {
@@ -55561,8 +55610,8 @@ function select_createInternalData() {
           key: 2,
           class: 'vxe-select-option--add-icon'
         }, [h('i', {
-          class: getIcon().SELECT_ADD_OPTION
-        })]) : renderEmptyElement($xeSelect)] : optVNs) : renderEmptyElement($xeSelect);
+          class: select_getIcon().SELECT_ADD_OPTION
+        })]) : select_renderEmptyElement($xeSelect)] : optVNs) : select_renderEmptyElement($xeSelect);
       });
     },
     renderOpts: function renderOpts(h) {
@@ -55575,17 +55624,17 @@ function select_createInternalData() {
         return [h('div', {
           class: 'vxe-select--search-loading'
         }, [h('i', {
-          class: ['vxe-select--search-icon', getIcon().SELECT_LOADED]
+          class: ['vxe-select--search-icon', select_getIcon().SELECT_LOADED]
         }), h('span', {
           class: 'vxe-select--search-text'
-        }, getI18n('vxe.select.loadingText'))])];
+        }, select_getI18n('vxe.select.loadingText'))])];
       }
       if (optList.length) {
         return $xeSelect.renderOption(h, optList);
       }
       return [h('div', {
         class: 'vxe-select--empty-placeholder'
-      }, props.emptyText || getI18n('vxe.select.emptyText'))];
+      }, props.emptyText || select_getI18n('vxe.select.emptyText'))];
     },
     renderVN: function renderVN(h) {
       var $xeSelect = this;
@@ -55606,8 +55655,11 @@ function select_createInternalData() {
         optList = reactData.optList,
         visiblePanel = reactData.visiblePanel,
         bodyHeight = reactData.bodyHeight,
-        topSpaceHeight = reactData.topSpaceHeight;
+        topSpaceHeight = reactData.topSpaceHeight,
+        xThumbWidth = reactData.xThumbWidth,
+        yThumbHeight = reactData.yThumbHeight;
       var vSize = $xeSelect.computeSize;
+      var isVScrollbar = $xeSelect.computeIsVScrollbar;
       var isDisabled = $xeSelect.computeIsDisabled;
       var selectLabel = $xeSelect.computeSelectLabel;
       var fullLabel = $xeSelect.computeFullLabel;
@@ -55637,6 +55689,14 @@ function select_createInternalData() {
       var footerSlot = slots.footer;
       var prefixSlot = slots.prefix;
       var ppClassName = popupOpts.className || props.popupClassName;
+      var scrollbarOpts = $xeSelect.computeScrollbarOpts;
+      var scrollXVisible = $xeSelect.computeScrollXVisible;
+      var scrollYVisible = $xeSelect.computeScrollYVisible;
+      var scrollbarXToTop = $xeSelect.computeScrollbarXToTop;
+      var scrollbarYToLeft = $xeSelect.computeScrollbarYToLeft;
+      var scrollXAutoHide = $xeSelect.computeScrollXAutoHide;
+      var scrollYAutoHide = $xeSelect.computeScrollYAutoHide;
+      var scrollbarWrapperClss = $xeSelect.computeScrollbarWrapperClss;
       return h('div', {
         ref: 'refElem',
         class: ['vxe-select', className ? external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(className) ? className({
@@ -55655,7 +55715,7 @@ function select_createInternalData() {
           disabled: isDisabled,
           type: 'text',
           prefixIcon: props.prefixIcon,
-          suffixIcon: loading ? getIcon().SELECT_LOADED : visiblePanel ? getIcon().SELECT_OPEN : getIcon().SELECT_CLOSE,
+          suffixIcon: loading ? select_getIcon().SELECT_LOADED : visiblePanel ? select_getIcon().SELECT_OPEN : select_getIcon().SELECT_CLOSE,
           autoFocus: false,
           title: fullLabel,
           value: selectLabel
@@ -55695,8 +55755,8 @@ function select_createInternalData() {
           clearable: true,
           disabled: false,
           readonly: false,
-          placeholder: getI18n('vxe.select.search'),
-          prefixIcon: getIcon().INPUT_SEARCH
+          placeholder: select_getI18n('vxe.select.search'),
+          prefixIcon: select_getIcon().INPUT_SEARCH
         },
         on: {
           'model-value': $xeSelect.modelSearchEvent,
@@ -55704,7 +55764,7 @@ function select_createInternalData() {
           change: $xeSelect.triggerSearchEvent,
           search: $xeSelect.triggerSearchEvent
         }
-      })]) : renderEmptyElement($xeSelect), showCheckedButton && multiple || showClearButton || headerSlot ? h('div', {
+      })]) : select_renderEmptyElement($xeSelect), showCheckedButton && multiple || showClearButton || headerSlot ? h('div', {
         class: 'vxe-select--panel-header'
       }, headerSlot ? $xeSelect.callSlot(headerSlot, {}, h) : [h('div', {
         class: 'vxe-tree-select--header-button'
@@ -55712,22 +55772,29 @@ function select_createInternalData() {
         class: 'vxe-tree-select--header-btns'
       }, [showCheckedButton && multiple ? h(packages_button, {
         props: {
-          content: getI18n('vxe.select.allChecked'),
+          content: select_getI18n('vxe.select.allChecked'),
           mode: 'text'
         },
         on: {
           click: $xeSelect.allCheckedPanelEvent
         }
-      }) : renderEmptyElement($xeSelect), showClearButton ? h(packages_button, {
+      }) : select_renderEmptyElement($xeSelect), showClearButton ? h(packages_button, {
         props: {
-          content: getI18n('vxe.select.clear'),
+          content: select_getI18n('vxe.select.clear'),
           mode: 'text'
         },
         on: {
           click: $xeSelect.clearCheckedPanelEvent
         }
-      }) : renderEmptyElement($xeSelect)])])]) : renderEmptyElement($xeSelect), h('div', {
-        class: 'vxe-select--panel-body'
+      }) : select_renderEmptyElement($xeSelect)])])]) : select_renderEmptyElement($xeSelect), h('div', {
+        class: ['vxe-select--panel-body', isVScrollbar ? "ov-x--".concat(scrollXVisible === false ? 'hidden' : 'visible') : '', isVScrollbar ? "ov-y--".concat(scrollYVisible === false ? 'hidden' : 'visible') : '', isVScrollbar ? "sx-pos--".concat(scrollbarXToTop ? 'top' : 'bottom') : '', isVScrollbar ? "sy-pos--".concat(scrollbarYToLeft ? 'left' : 'right') : '', {
+          'is--virtual-scrollbar': isVScrollbar,
+          'ov-padding': isVScrollbar && scrollbarOpts.padding,
+          'ov-x--auto-hide': isVScrollbar && scrollXAutoHide,
+          'ov-y--auto-hide': isVScrollbar && scrollYAutoHide,
+          'overflow-y': yThumbHeight,
+          'overflow-x': xThumbWidth
+        }]
       }, [h('div', {
         ref: 'refVirtualWrapper',
         class: 'vxe-select-option--wrapper',
@@ -55735,6 +55802,7 @@ function select_createInternalData() {
           scroll: $xeSelect.scrollEvent
         }
       }, [h('div', {
+        ref: 'refVirtualSpaceElem',
         class: 'vxe-select--y-space',
         style: {
           height: bodyHeight ? "".concat(bodyHeight, "px") : ''
@@ -55745,23 +55813,61 @@ function select_createInternalData() {
         style: {
           transform: "translateY(".concat(topSpaceHeight, "px)")
         }
-      }, $xeSelect.renderOpts(h))])]), footerSlot || showTotalButton || showCloseButton && multiple ? h('div', {
+      }, $xeSelect.renderOpts(h))]),
+      /**
+       * 滚动条
+       */
+      isVScrollbar ? h('div', {
+        class: scrollbarWrapperClss
+      }, [scrollXVisible === false ? select_renderEmptyElement($xeSelect) : h('div', {
+        ref: 'refTrackXElem',
+        class: 'vxe-scrollbar--track-x',
+        on: {
+          click: $xeSelect.clickTrackXEvent
+        }
+      }, [h('div', {
+        ref: 'refThumbXElem',
+        class: 'vxe-scrollbar--thumb-x',
+        on: {
+          pointerdown: $xeSelect.pointerdownThumbXEvent,
+          pointermove: $xeSelect.pointermoveThumbXEvent,
+          pointerup: $xeSelect.cleatPointerThumbEvent,
+          pointercancel: $xeSelect.cleatPointerThumbEvent,
+          lostpointercapture: $xeSelect.cleatPointerThumbEvent
+        }
+      })]), scrollYVisible === false ? select_renderEmptyElement($xeSelect) : h('div', {
+        ref: 'refTrackYElem',
+        class: 'vxe-scrollbar--track-y',
+        on: {
+          click: $xeSelect.clickTrackYEvent
+        }
+      }, [h('div', {
+        ref: 'refThumbYElem',
+        class: 'vxe-scrollbar--thumb-y',
+        on: {
+          pointerdown: $xeSelect.pointerdownThumbYEvent,
+          pointermove: $xeSelect.pointermoveThumbYEvent,
+          pointerup: $xeSelect.cleatPointerThumbEvent,
+          pointercancel: $xeSelect.cleatPointerThumbEvent,
+          lostpointercapture: $xeSelect.cleatPointerThumbEvent
+        }
+      })])]) : select_renderEmptyElement($xeSelect)]), footerSlot || showTotalButton || showCloseButton && multiple ? h('div', {
         class: 'vxe-select--panel-footer'
       }, footerSlot ? $xeSelect.callSlot(footerSlot, {}, h) : [h('div', {
         class: 'vxe-select--footer-button'
       }, [showTotalButton ? h('div', {
         class: 'vxe-select--total-btns'
-      }, getI18n('vxe.select.total', [selectVals.length, optList.length])) : renderEmptyElement($xeSelect), showCloseButton && multiple ? h('div', {
+      }, select_getI18n('vxe.select.total', [selectVals.length, optList.length])) : select_renderEmptyElement($xeSelect), showCloseButton && multiple ? h('div', {
         class: 'vxe-select--oper-btns'
       }, [h(packages_button, {
         props: {
-          content: getI18n('vxe.select.close'),
+          content: select_getI18n('vxe.select.close'),
           mode: 'text'
         },
         on: {
           click: $xeSelect.closePanelEvent
         }
-      })]) : renderEmptyElement($xeSelect)])]) : renderEmptyElement($xeSelect)])] : [])]);
+      })]) : select_renderEmptyElement($xeSelect)])]) : select_renderEmptyElement($xeSelect)])] : [])]);
     }
   },
   watch: {
@@ -55776,6 +55882,47 @@ function select_createInternalData() {
     optionGroups: function optionGroups(val) {
       var $xeSelect = this;
       $xeSelect.loadData(val);
+    },
+    computeIsVScrollbar: function computeIsVScrollbar() {
+      var $xeSelect = this;
+      $xeSelect.$nextTick(function () {
+        $xeSelect.bindScrollbarResize();
+        $xeSelect.$nextTick(function () {
+          $xeSelect.reLayoutFlag++;
+        });
+      });
+    },
+    computeScrollYWidth: function computeScrollYWidth() {
+      var $xeSelect = this;
+      $xeSelect.reLayoutFlag++;
+    },
+    computeScrollXHeight: function computeScrollXHeight() {
+      var $xeSelect = this;
+      $xeSelect.reLayoutFlag++;
+    },
+    computeScrollXVisible: function computeScrollXVisible() {
+      var $xeSelect = this;
+      $xeSelect.$nextTick(function () {
+        $xeSelect.reLayoutFlag++;
+      });
+    },
+    computeScrollYVisible: function computeScrollYVisible() {
+      var $xeSelect = this;
+      $xeSelect.$nextTick(function () {
+        $xeSelect.reLayoutFlag++;
+      });
+    },
+    reLayoutFlag: function reLayoutFlag() {
+      var $xeSelect = this;
+      $xeSelect.recalculate().then(function () {
+        $xeSelect.recalculate();
+      });
+    },
+    reScrollFlag: function reScrollFlag() {
+      var $xeSelect = this;
+      $xeSelect.updateScrollbar().then(function () {
+        $xeSelect.updateScrollbar();
+      });
     }
   },
   created: function created() {
@@ -55794,23 +55941,30 @@ function select_createInternalData() {
         $xeSelect.loadData(options);
       }
     });
-    globalEvents.on($xeSelect, 'mousedown', $xeSelect.handleGlobalMousedownEvent);
-    globalEvents.on($xeSelect, 'keydown', $xeSelect.handleGlobalKeydownEvent);
-    globalEvents.on($xeSelect, 'blur', $xeSelect.handleGlobalBlurEvent);
-    globalEvents.on($xeSelect, 'resize', $xeSelect.handleGlobalResizeEvent);
-    globalEvents.on($xeSelect, 'scroll', $xeSelect.handleGlobalScrollEvent);
+    $xeSelect.reLayoutFlag++;
+    $xeSelect.bindScrollbarResize();
+    select_globalEvents.on($xeSelect, 'mousedown', $xeSelect.handleGlobalMousedownEvent);
+    select_globalEvents.on($xeSelect, 'keydown', $xeSelect.handleGlobalKeydownEvent);
+    select_globalEvents.on($xeSelect, 'blur', $xeSelect.handleGlobalBlurEvent);
+    select_globalEvents.on($xeSelect, 'resize', $xeSelect.handleGlobalResizeEvent);
+    select_globalEvents.on($xeSelect, 'scroll', $xeSelect.handleGlobalScrollEvent);
   },
   beforeDestroy: function beforeDestroy() {
     var $xeSelect = this;
+    var internalData = $xeSelect.internalData;
+    var scrollObserver = internalData.scrollObserver;
     var panelElem = $xeSelect.$refs.refOptionPanel;
     if (panelElem && panelElem.parentNode) {
       panelElem.parentNode.removeChild(panelElem);
     }
-    globalEvents.off($xeSelect, 'mousedown');
-    globalEvents.off($xeSelect, 'keydown');
-    globalEvents.off($xeSelect, 'blur');
-    globalEvents.off($xeSelect, 'resize');
-    globalEvents.off($xeSelect, 'scroll');
+    if (scrollObserver) {
+      scrollObserver.disconnect();
+    }
+    select_globalEvents.off($xeSelect, 'mousedown');
+    select_globalEvents.off($xeSelect, 'keydown');
+    select_globalEvents.off($xeSelect, 'blur');
+    select_globalEvents.off($xeSelect, 'resize');
+    select_globalEvents.off($xeSelect, 'scroll');
   },
   destroyed: function destroyed() {
     var $xeSelect = this;
@@ -66302,14 +66456,11 @@ var tree_createComponentLog = createComponentLog('tree'),
   tree_warnLog = tree_createComponentLog.warnLog,
   tree_errLog = tree_createComponentLog.errLog;
 var tree_menus = VxeUI.menus,
-  tree_scrollbarUtils = VxeUI.scrollbarUtils,
   tree_getConfig = VxeUI.getConfig,
   tree_getI18n = VxeUI.getI18n,
-  tree_getIcon = VxeUI.getIcon;
-var tree_getThumbOffsetSize = tree_scrollbarUtils.getThumbOffsetSize,
-  tree_getThumbSize = tree_scrollbarUtils.getThumbSize,
-  tree_getScrollFromClick = tree_scrollbarUtils.getScrollFromClick,
-  tree_getScrollFromDrag = tree_scrollbarUtils.getScrollFromDrag;
+  tree_getIcon = VxeUI.getIcon,
+  tree_baseUtils = VxeUI.baseUtils;
+var tree_getDefVal = tree_baseUtils.getDefVal;
 var crossTreeDragNodeObj = null;
 /**
  * 生成节点的唯一主键
@@ -66865,7 +67016,7 @@ function tree_createInternalData() {
 }
 /* harmony default export */ var tree = (/* define-vxe-component start */defineVxeComponent({
   name: 'VxeTree',
-  mixins: [globalMixins.sizeMixin, globalMixins.vScrollbarMixin],
+  mixins: [globalMixins.sizeMixin, globalMixins.vScrollbarMixin, globalMixins.initVScrollbarMixin],
   props: {
     data: Array,
     autoResize: {
@@ -67045,7 +67196,7 @@ function tree_createInternalData() {
     useScrollbar: {
       type: Boolean,
       default: function _default() {
-        return getDefaultConfig(tree_getConfig().tree.useScrollbar, tree_getConfig().useScrollbar);
+        return tree_getDefVal(tree_getConfig().tree.useScrollbar, tree_getConfig().useScrollbar);
       }
     },
     scrollbarConfig: Object
@@ -67241,37 +67392,37 @@ function tree_createInternalData() {
       var $xeTree = this;
       var scrollbarOpts = $xeTree.computeScrollbarOpts;
       var scrollbarXOpts = $xeTree.computeScrollbarXOpts;
-      return getDefaultConfig(getDefaultConfig(scrollbarXOpts.height, scrollbarOpts.height), tree_getConfig().scrollbar.height);
+      return tree_getDefVal(tree_getDefVal(scrollbarXOpts.height, scrollbarOpts.height), tree_getConfig().scrollbar.height);
     },
     computeScrollYWidth: function computeScrollYWidth() {
       var $xeTree = this;
       var scrollbarOpts = $xeTree.computeScrollbarOpts;
       var scrollbarYOpts = $xeTree.computeScrollbarYOpts;
-      return getDefaultConfig(getDefaultConfig(scrollbarYOpts.width, scrollbarOpts.width), tree_getConfig().scrollbar.width);
+      return tree_getDefVal(tree_getDefVal(scrollbarYOpts.width, scrollbarOpts.width), tree_getConfig().scrollbar.width);
     },
     computeScrollXVisible: function computeScrollXVisible() {
       var $xeTree = this;
       var scrollbarOpts = $xeTree.computeScrollbarOpts;
       var scrollbarXOpts = $xeTree.computeScrollbarXOpts;
-      return getDefaultConfig(scrollbarXOpts.visible, scrollbarOpts.visible);
+      return tree_getDefVal(scrollbarXOpts.visible, scrollbarOpts.visible);
     },
     computeScrollYVisible: function computeScrollYVisible() {
       var $xeTree = this;
       var scrollbarOpts = $xeTree.computeScrollbarOpts;
       var scrollbarYOpts = $xeTree.computeScrollbarYOpts;
-      return getDefaultConfig(scrollbarYOpts.visible, scrollbarOpts.visible);
+      return tree_getDefVal(scrollbarYOpts.visible, scrollbarOpts.visible);
     },
     computeScrollXAutoHide: function computeScrollXAutoHide() {
       var $xeTree = this;
       var scrollbarOpts = $xeTree.computeScrollbarOpts;
       var scrollbarXOpts = $xeTree.computeScrollbarXOpts;
-      return getDefaultConfig(getDefaultConfig(scrollbarXOpts.autoHide, scrollbarOpts.autoHide), tree_getConfig().scrollbar.autoHide);
+      return tree_getDefVal(tree_getDefVal(scrollbarXOpts.autoHide, scrollbarOpts.autoHide), tree_getConfig().scrollbar.autoHide);
     },
     computeScrollYAutoHide: function computeScrollYAutoHide() {
       var $xeTree = this;
       var scrollbarOpts = $xeTree.computeScrollbarOpts;
       var scrollbarYOpts = $xeTree.computeScrollbarYOpts;
-      return getDefaultConfig(getDefaultConfig(scrollbarYOpts.autoHide, scrollbarOpts.autoHide), tree_getConfig().scrollbar.autoHide);
+      return tree_getDefVal(tree_getDefVal(scrollbarYOpts.autoHide, scrollbarOpts.autoHide), tree_getConfig().scrollbar.autoHide);
     },
     computeScrollbarWrapperClss: function computeScrollbarWrapperClss() {
       var $xeTree = this;
@@ -67308,6 +67459,11 @@ function tree_createInternalData() {
         $tree: $xeTree
       }, params));
     },
+    getScrollViewElem: function getScrollViewElem() {
+      var $xeTree = this;
+      var viewEl = $xeTree.$refs.refVirtualWrapper;
+      return viewEl || null;
+    },
     getNodeId: function getNodeId(node) {
       var $xeTree = this;
       if (!node) {
@@ -69839,188 +69995,6 @@ function tree_createInternalData() {
         }
       }
     },
-    updateThumbSize: function updateThumbSize() {
-      var $xeTree = this;
-      var reactData = $xeTree.reactData;
-      var viewEl = $xeTree.$refs.refVirtualWrapper;
-      if (!viewEl) {
-        return;
-      }
-      if (!viewEl.clientHeight || !viewEl.clientHeight) {
-        return;
-      }
-      var trackXEl = $xeTree.$refs.refTrackXElem;
-      var xThumbWidth = trackXEl ? tree_getThumbSize(viewEl.clientWidth, viewEl.scrollWidth, trackXEl.clientWidth) : 0;
-      var thumbXElem = $xeTree.$refs.refThumbXElem;
-      if (thumbXElem) {
-        thumbXElem.style.width = xThumbWidth + 'px';
-      }
-      reactData.xThumbWidth = xThumbWidth;
-      var trackYEl = $xeTree.$refs.refTrackYElem;
-      var yThumbHeight = trackYEl ? tree_getThumbSize(viewEl.clientHeight, viewEl.scrollHeight, trackYEl.clientHeight) : 0;
-      var thumbYElem = $xeTree.$refs.refThumbYElem;
-      if (thumbYElem) {
-        thumbYElem.style.height = yThumbHeight + 'px';
-      }
-      reactData.yThumbHeight = yThumbHeight;
-    },
-    updateThumbOffset: function updateThumbOffset() {
-      var $xeTree = this;
-      var reactData = $xeTree.reactData;
-      var internalData = $xeTree.internalData;
-      var viewEl = $xeTree.$refs.refVirtualWrapper;
-      if (!viewEl) {
-        return;
-      }
-      if (!viewEl.clientHeight || !viewEl.clientHeight) {
-        return;
-      }
-      var xThumbWidth = reactData.xThumbWidth,
-        yThumbHeight = reactData.yThumbHeight;
-      var trackXEl = $xeTree.$refs.refTrackXElem;
-      var thumbXElem = $xeTree.$refs.refThumbXElem;
-      var xThumbLeft = trackXEl && xThumbWidth ? tree_getThumbOffsetSize(viewEl.scrollLeft, viewEl.clientWidth, viewEl.scrollWidth, trackXEl.clientWidth, xThumbWidth) : 0;
-      internalData.xThumbLeft = xThumbLeft;
-      if (thumbXElem && xThumbWidth) {
-        thumbXElem.style.width = xThumbWidth + 'px';
-        thumbXElem.style.transform = "translateX(".concat(xThumbLeft, "px)");
-      }
-      var trackYEl = $xeTree.$refs.refTrackYElem;
-      var thumbYElem = $xeTree.$refs.refThumbYElem;
-      var yThumbTop = trackYEl && yThumbHeight ? tree_getThumbOffsetSize(viewEl.scrollTop, viewEl.clientHeight, viewEl.scrollHeight, trackYEl.clientHeight, yThumbHeight) : 0;
-      internalData.yThumbTop = yThumbTop;
-      if (thumbYElem && yThumbHeight) {
-        thumbYElem.style.height = yThumbHeight + 'px';
-        thumbYElem.style.transform = "translateY(".concat(yThumbTop, "px)");
-      }
-    },
-    clickTrackXEvent: function clickTrackXEvent(evnt) {
-      var $xeTree = this;
-      var reactData = $xeTree.reactData;
-      var trackEl = evnt.currentTarget;
-      if (trackEl !== evnt.target) {
-        return;
-      }
-      var viewEl = $xeTree.$refs.refVirtualWrapper;
-      if (!viewEl) {
-        return;
-      }
-      var xThumbWidth = reactData.xThumbWidth;
-      var trackRect = trackEl.getBoundingClientRect();
-      viewEl.scrollTo({
-        left: tree_getScrollFromClick(evnt.clientX - trackRect.left, viewEl.clientWidth, viewEl.scrollWidth, trackEl.clientWidth, xThumbWidth),
-        behavior: 'auto'
-      });
-    },
-    clickTrackYEvent: function clickTrackYEvent(evnt) {
-      var $xeTree = this;
-      var reactData = $xeTree.reactData;
-      var trackEl = evnt.currentTarget;
-      if (trackEl !== evnt.target) {
-        return;
-      }
-      var viewEl = $xeTree.$refs.refVirtualWrapper;
-      if (!viewEl) {
-        return;
-      }
-      var yThumbHeight = reactData.yThumbHeight;
-      var trackRect = trackEl.getBoundingClientRect();
-      viewEl.scrollTo({
-        top: tree_getScrollFromClick(evnt.clientY - trackRect.top, viewEl.clientHeight, viewEl.scrollHeight, trackEl.clientHeight, yThumbHeight),
-        behavior: 'auto'
-      });
-    },
-    pointerdownThumbXEvent: function pointerdownThumbXEvent(evnt) {
-      var $xeTree = this;
-      var reactData = $xeTree.reactData;
-      var internalData = $xeTree.internalData;
-      var thumbEl = evnt.currentTarget;
-      internalData.isThumbDrag = true;
-      thumbEl.setPointerCapture(evnt.pointerId);
-      var viewEl = $xeTree.$refs.refVirtualWrapper;
-      if (!viewEl) {
-        return;
-      }
-      var xThumbWidth = reactData.xThumbWidth;
-      var trackEl = thumbEl.parentElement;
-      var trackRect = trackEl.getBoundingClientRect();
-      var pointerPosition = evnt.clientX - trackRect.left;
-      // 记录 thumb 的偏移
-      var thumbOffset = tree_getThumbOffsetSize(viewEl.scrollLeft, viewEl.clientWidth, viewEl.scrollWidth, trackEl.clientWidth, xThumbWidth);
-      internalData.thumbDragOffset = pointerPosition - thumbOffset;
-    },
-    pointermoveThumbXEvent: function pointermoveThumbXEvent(evnt) {
-      var $xeTree = this;
-      var reactData = $xeTree.reactData;
-      var internalData = $xeTree.internalData;
-      var thumbEl = evnt.currentTarget;
-      if (!thumbEl.hasPointerCapture(evnt.pointerId)) {
-        return;
-      }
-      var isThumbDrag = internalData.isThumbDrag,
-        thumbDragOffset = internalData.thumbDragOffset;
-      if (isThumbDrag) {
-        var viewEl = $xeTree.$refs.refVirtualWrapper;
-        if (!viewEl) {
-          return;
-        }
-        var xThumbWidth = reactData.xThumbWidth;
-        var _thumbEl = evnt.currentTarget;
-        var trackEl = _thumbEl.parentElement;
-        var trackRect = trackEl.getBoundingClientRect();
-        // 更新偏移
-        viewEl.scrollLeft = tree_getScrollFromDrag(evnt.clientX - trackRect.left, thumbDragOffset, viewEl.clientWidth, viewEl.scrollWidth, trackEl.clientWidth, xThumbWidth);
-      }
-    },
-    cleatPointerThumbEvent: function cleatPointerThumbEvent(evnt) {
-      var $xeTree = this;
-      var internalData = $xeTree.internalData;
-      var thumbEl = evnt.currentTarget;
-      thumbEl.releasePointerCapture(evnt.pointerId);
-      internalData.isThumbDrag = false;
-    },
-    pointerdownThumbYEvent: function pointerdownThumbYEvent(evnt) {
-      var $xeTree = this;
-      var reactData = $xeTree.reactData;
-      var internalData = $xeTree.internalData;
-      var thumbEl = evnt.currentTarget;
-      internalData.isThumbDrag = true;
-      thumbEl.setPointerCapture(evnt.pointerId);
-      var viewEl = $xeTree.$refs.refVirtualWrapper;
-      if (!viewEl) {
-        return;
-      }
-      var yThumbHeight = reactData.yThumbHeight;
-      var trackEl = thumbEl.parentElement;
-      var trackRect = trackEl.getBoundingClientRect();
-      var pointerPosition = evnt.clientY - trackRect.top;
-      // 记录 thumb 的偏移
-      var thumbOffset = tree_getThumbOffsetSize(viewEl.scrollTop, viewEl.clientHeight, viewEl.scrollHeight, trackEl.clientHeight, yThumbHeight);
-      internalData.thumbDragOffset = pointerPosition - thumbOffset;
-    },
-    pointermoveThumbYEvent: function pointermoveThumbYEvent(evnt) {
-      var $xeTree = this;
-      var reactData = $xeTree.reactData;
-      var internalData = $xeTree.internalData;
-      var thumbEl = evnt.currentTarget;
-      if (!thumbEl.hasPointerCapture(evnt.pointerId)) {
-        return;
-      }
-      var isThumbDrag = internalData.isThumbDrag,
-        thumbDragOffset = internalData.thumbDragOffset;
-      if (isThumbDrag) {
-        var viewEl = $xeTree.$refs.refVirtualWrapper;
-        if (!viewEl) {
-          return;
-        }
-        var yThumbHeight = reactData.yThumbHeight;
-        var _thumbEl2 = evnt.currentTarget;
-        var trackEl = _thumbEl2.parentElement;
-        var trackRect = trackEl.getBoundingClientRect();
-        // 更新偏移
-        viewEl.scrollTop = tree_getScrollFromDrag(evnt.clientY - trackRect.top, thumbDragOffset, viewEl.clientHeight, viewEl.scrollHeight, trackEl.clientHeight, yThumbHeight);
-      }
-    },
     //
     // Render
     //