vxe-pc-ui 4.20.8 → 4.20.9

package/lib/index.umd.js

@@ -3084,6 +3084,7 @@ __webpack_require__.d(__webpack_exports__, {
   useFns: function() { return /* reexport */ useFns; },
   usePermission: function() { return /* reexport */ usePermission; },
   useSize: function() { return /* reexport */ useSize; },
+  useVScrollbar: function() { return /* reexport */ useVScrollbar; },
   validators: function() { return /* reexport */ validators; },
   version: function() { return /* reexport */ ui_version; },
   watermark: function() { return /* reexport */ components_watermark; }
@@ -3342,6 +3343,7 @@ __webpack_require__.d(components_namespaceObject, {
   useFns: function() { return useFns; },
   usePermission: function() { return usePermission; },
   useSize: function() { return useSize; },
+  useVScrollbar: function() { return useVScrollbar; },
   validators: function() { return validators; },
   version: function() { return ui_version; },
   watermark: function() { return components_watermark; }
@@ -3368,7 +3370,7 @@ if (typeof window !== 'undefined') {
 // EXTERNAL MODULE: ./node_modules/core-js/modules/es.array.push.js
 var es_array_push = __webpack_require__(4114);
 ;// ./node_modules/@vxe-ui/core/es/src/core.js
-const coreVersion = "4.4.33";
+const coreVersion = "4.4.35";
 const VxeCore = {
   coreVersion,
   uiVersion: '',
@@ -3996,7 +3998,7 @@ function createLog(type, name) {
     return msg;
   };
 }
-const version = "4.4.33";
+const version = "4.4.35";
 const log = {
   create: createLog,
   warn: createLog('warn', `v${version}`),
@@ -4815,17 +4817,35 @@ const hooks = new store();
 ;// ./node_modules/@vxe-ui/core/es/src/useFns.js
 
 
+
 function useSize(props) {
   // 组件尺寸上下文
   const xeSizeInfo = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('xeSizeInfo', null);
   const computeSize = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
-    return props.size || (xeSizeInfo ? xeSizeInfo.value : null);
+    const {
+      size
+    } = props;
+    return size || (xeSizeInfo ? xeSizeInfo.value : null);
   });
   (0,external_commonjs_vue_commonjs2_vue_root_Vue_.provide)('xeSizeInfo', computeSize);
   return {
     computeSize
   };
 }
+function useVScrollbar(props) {
+  // 组件虚拟滚动条
+  const xeScrollbarInfo = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('xeScrollbarInfo', null);
+  const computeIsVScrollbar = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+    const {
+      useScrollbar
+    } = props;
+    return external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isBoolean(useScrollbar) ? useScrollbar : xeScrollbarInfo ? xeScrollbarInfo.value : null;
+  });
+  (0,external_commonjs_vue_commonjs2_vue_root_Vue_.provide)('xeScrollbarInfo', computeIsVScrollbar);
+  return {
+    computeIsVScrollbar
+  };
+}
 function usePermission(props) {
   const computePermissionInfo = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
     return handleCheckInfo(props.permissionCode, props.permissionMethod);
@@ -4836,6 +4856,7 @@ function usePermission(props) {
 }
 const useFns = {
   useSize,
+  useVScrollbar,
   usePermission
 };
 ;// ./node_modules/@vxe-ui/core/es/index.esm.js
@@ -5081,7 +5102,7 @@ function checkDynamic() {
 const {
   log: log_log
 } = VxeUI;
-const uiVersion = `ui v${"4.20.8"}`;
+const uiVersion = `ui v${"4.20.9"}`;
 function createComponentLog(name) {
   const tableVersion = VxeUI.tableVersion ? `table v${VxeUI.tableVersion}` : '';
   const ganttVersion = VxeUI.ganttVersion ? `gantt v${VxeUI.ganttVersion}` : '';
@@ -5099,7 +5120,7 @@ const errLog = log_log.create('error', uiVersion);
 
 
 
-const ui_version = "4.20.8";
+const ui_version = "4.20.9";
 VxeUI.uiVersion = ui_version;
 VxeUI.dynamicApp = dynamicApp;
 function config(options) {
@@ -8065,10 +8086,18 @@ function createInternalData() {
       type: String,
       default: () => scrollbar_getConfig().scrollbar.viewInnerClassName
     },
+    /**
+     * 已废弃
+     * @deprecated
+     */
     autoResize: {
       type: Boolean,
       default: () => scrollbar_getConfig().scrollbar.autoResize
     },
+    /**
+     * 已废弃
+     * @deprecated
+     */
     syncResize: [Boolean, String, Number]
   },
   emits: ['scroll', 'scroll-boundary'],
@@ -8859,7 +8888,10 @@ function tooltip_createInternalData() {
     const xID = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().uniqueId();
     const {
       computeSize
-    } = useSize(props);
+    } = useFns.useSize(props);
+    const {
+      computeIsVScrollbar
+    } = useFns.useVScrollbar(props);
     const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)(tooltip_createReactData());
     const internalData = tooltip_createInternalData();
     const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
@@ -9150,7 +9182,9 @@ function tooltip_createInternalData() {
         return updateTipStyle().then(() => {
           return updateTipStyle();
         }).then(() => {
-          return updateTipStyle();
+          setTimeout(() => {
+            updateTipStyle();
+          }, 15);
         });
       },
       isActived() {
@@ -9177,7 +9211,6 @@ function tooltip_createInternalData() {
     Object.assign($xeTooltip, tooltipMethods, tooltipPrivateMethods);
     const renderContent = () => {
       const {
-        useScrollbar,
         theme,
         useHtml,
         useHTML
@@ -9185,6 +9218,7 @@ function tooltip_createInternalData() {
       const {
         tipContent
       } = reactData;
+      const isVScrollbar = computeIsVScrollbar.value;
       const wrapperStyle = computeWrapperStyle.value;
       const contentSlot = slots.content;
       const contVNs = [];
@@ -9202,7 +9236,7 @@ function tooltip_createInternalData() {
           key: 'cd'
         }, `${tipContent}`));
       }
-      if (useScrollbar) {
+      if (isVScrollbar) {
         return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
           key: 5,
           ref: contentScrollbar,
@@ -12832,7 +12866,10 @@ const Calendar = VxeCalendar;
     const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const {
       computeSize
-    } = useSize(props);
+    } = useFns.useSize(props);
+    const {
+      computeIsVScrollbar
+    } = useFns.useVScrollbar(props);
     const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)({});
     const refMaps = {
       refElem
@@ -12895,8 +12932,7 @@ const Calendar = VxeCalendar;
         shadow,
         padding,
         loading,
-        showTitleOverflow,
-        useScrollbar
+        showTitleOverflow
       } = props;
       const defaultSlot = slots.default;
       const headerSlot = slots.header;
@@ -12906,6 +12942,7 @@ const Calendar = VxeCalendar;
       const leftSlot = slots.left;
       const rightSlot = slots.right;
       const vSize = computeSize.value;
+      const isVScrollbar = computeIsVScrollbar.value;
       const cardStyle = computeCardStyle.value;
       const scrollbarOpts = computeScrollbarOpts.value;
       const scrollbarProps = computeScrollbarProps.value;
@@ -12932,7 +12969,7 @@ const Calendar = VxeCalendar;
         class: 'vxe-card--header-extra'
       }, vn_getSlotVNs(extraSlot({}))) : renderEmptyElement($xeCard)]) : renderEmptyElement($xeCard), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         class: 'vxe-card--body'
-      }, [leftSlot ? useScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
+      }, [leftSlot ? isVScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
         class: 'vxe-card--body-scrollbar-left',
         ...scrollbarProps,
         viewClassName: 'vxe-card--body-scrollbar-left-view',
@@ -12941,7 +12978,7 @@ const Calendar = VxeCalendar;
         default: () => vn_getSlotVNs(leftSlot({}))
       }) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         class: 'vxe-card--body-left'
-      }, vn_getSlotVNs(leftSlot({}))) : renderEmptyElement($xeCard), useScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
+      }, vn_getSlotVNs(leftSlot({}))) : renderEmptyElement($xeCard), isVScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
         class: 'vxe-card--body-scrollbar-content',
         ...scrollbarProps,
         viewClassName: 'vxe-card--body-scrollbar-content-view' + (viewClassName ? ' ' + viewClassName : ''),
@@ -12950,7 +12987,7 @@ const Calendar = VxeCalendar;
         default: () => defaultSlot ? vn_getSlotVNs(defaultSlot({})) : []
       }) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         class: 'vxe-card--body-content'
-      }, defaultSlot ? vn_getSlotVNs(defaultSlot({})) : []), rightSlot ? useScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
+      }, defaultSlot ? vn_getSlotVNs(defaultSlot({})) : []), rightSlot ? isVScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
         class: 'vxe-card--body-scrollbar-right',
         ...scrollbarProps,
         viewClassName: 'vxe-card--body-scrollbar-right-view',
@@ -13617,6 +13654,7 @@ const {
   getI18n: list_getI18n,
   domUtils: list_domUtils,
   scrollbarUtils: list_scrollbarUtils,
+  useFns: list_useFns,
   menus: list_menus,
   globalEvents: list_globalEvents,
   globalResize: list_globalResize
@@ -13752,7 +13790,10 @@ let crossListDragRowObj = null;
     const browseObj = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().browse();
     const {
       computeSize
-    } = useSize(props);
+    } = list_useFns.useSize(props);
+    const {
+      computeIsVScrollbar
+    } = list_useFns.useVScrollbar(props);
     const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)(list_createReactData());
     const internalData = list_createInternalData();
     const crossListDragRowInfo = getCrossListDragRowInfo();
@@ -13760,6 +13801,7 @@ let crossListDragRowObj = null;
     const refHeaderElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refFooterElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refVirtualWrapper = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
+    const refVirtualSpaceElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refVirtualBody = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refTrackXElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refTrackYElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
@@ -14099,7 +14141,6 @@ let crossListDragRowObj = null;
         lastScrollLeft,
         lastScrollTop
       } = internalData;
-      updateScrollbar();
       return clearScroll().then(() => {
         if (lastScrollLeft || lastScrollTop) {
           internalData.lastScrollLeft = 0;
@@ -14109,8 +14150,14 @@ let crossListDragRowObj = null;
       });
     };
     const updateScrollbar = () => {
-      updateThumbSize();
-      updateThumbOffset();
+      const isVScrollbar = computeIsVScrollbar.value;
+      if (isVScrollbar) {
+        return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(() => {
+          updateThumbSize();
+          updateThumbOffset();
+        });
+      }
+      return Promise.resolve();
     };
     /**
      * 重新计算列表
@@ -14129,10 +14176,11 @@ let crossListDragRowObj = null;
           parentHeight = parentEl.clientHeight - Math.ceil(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(parentStyle.paddingLeft) + external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(parentStyle.paddingRight));
         }
         reactData.parentHeight = parentHeight;
-        updateScrollbar();
         updateHeight();
         if (el.clientWidth && el.clientHeight) {
-          return computeScrollLoad();
+          return computeScrollLoad().then(() => {
+            updateScrollbar();
+          });
         }
       }
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
@@ -14148,7 +14196,7 @@ let crossListDragRowObj = null;
         offsetSize,
         rowHeight
       } = scrollYStore;
-      const scrollBodyElem = evnt.target;
+      const scrollBodyElem = evnt.currentTarget;
       const scrollTop = scrollBodyElem.scrollTop;
       const toVisibleIndex = Math.floor(scrollTop / rowHeight);
       const offsetStartIndex = Math.max(0, toVisibleIndex - 1 - offsetSize);
@@ -14162,7 +14210,7 @@ let crossListDragRowObj = null;
       }
     };
     const scrollEvent = evnt => {
-      const scrollBodyElem = evnt.target;
+      const scrollBodyElem = evnt.currentTarget;
       const scrollTop = scrollBodyElem.scrollTop;
       const scrollLeft = scrollBodyElem.scrollLeft;
       const isX = scrollLeft !== internalData.lastScrollLeft;
@@ -15674,6 +15722,28 @@ let crossListDragRowObj = null;
         hideDropTip();
       }
     };
+    const bindScrollbarResize = () => {
+      const {
+        scrollObserver
+      } = internalData;
+      const isVScrollbar = computeIsVScrollbar.value;
+      if (isVScrollbar) {
+        if (!scrollObserver) {
+          const el = refElem.value;
+          const viewInnerEl = refVirtualSpaceElem.value;
+          const scrollObserver = list_globalResize.create(() => {
+            reScrollFlag.value++;
+          });
+          if (el) {
+            scrollObserver.observe(el);
+          }
+          if (viewInnerEl) {
+            scrollObserver.observe(viewInnerEl);
+          }
+          internalData.scrollObserver = scrollObserver;
+        }
+      }
+    };
     const updateThumbSize = () => {
       const viewEl = refVirtualWrapper.value;
       if (!viewEl) {
@@ -16085,8 +16155,7 @@ let crossListDragRowObj = null;
       const {
         showCheckbox,
         className,
-        loading,
-        useScrollbar
+        loading
       } = props;
       const {
         bodyHeight,
@@ -16101,6 +16170,7 @@ let crossListDragRowObj = null;
       const headerSlot = slots.header;
       const footerSlot = slots.footer;
       const vSize = computeSize.value;
+      const isVScrollbar = computeIsVScrollbar.value;
       const wrapperStyles = computeWrapperStyles.value;
       const virtualStyles = computeVirtualStyles.value;
       const radioOpts = computeRadioOpts.value;
@@ -16135,14 +16205,14 @@ let crossListDragRowObj = null;
       }
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         ref: refElem,
-        class: ['vxe-list', useScrollbar ? `ov-x--${scrollXVisible === false ? 'hidden' : 'visible'}` : '', useScrollbar ? `ov-y--${scrollYVisible === false ? 'hidden' : 'visible'}` : '', useScrollbar ? `sx-pos--${scrollbarXToTop ? 'top' : 'bottom'}` : '', useScrollbar ? `sy-pos--${scrollbarYToLeft ? 'left' : 'right'}` : '', className ? external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(className) ? className({
+        class: ['vxe-list', isVScrollbar ? `ov-x--${scrollXVisible === false ? 'hidden' : 'visible'}` : '', isVScrollbar ? `ov-y--${scrollYVisible === false ? 'hidden' : 'visible'}` : '', isVScrollbar ? `sx-pos--${scrollbarXToTop ? 'top' : 'bottom'}` : '', isVScrollbar ? `sy-pos--${scrollbarYToLeft ? 'left' : 'right'}` : '', className ? external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(className) ? className({
           $list: $xeList
         }) : className : '', {
           [`size--${vSize}`]: vSize,
-          'is--virtual-scrollbar': useScrollbar,
-          'ov-padding': useScrollbar && scrollbarOpts.padding,
-          'ov-x--auto-hide': useScrollbar && scrollXAutoHide,
-          'ov-y--auto-hide': useScrollbar && scrollYAutoHide,
+          '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,
           'is--drag': isDrag,
@@ -16176,6 +16246,7 @@ let crossListDragRowObj = null;
         style: virtualStyles,
         onScroll: scrollEvent
       }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        ref: refVirtualSpaceElem,
         class: 'vxe-list--y-space',
         style: {
           height: bodyHeight ? `${bodyHeight}px` : ''
@@ -16205,7 +16276,7 @@ let crossListDragRowObj = null;
       /**
        * 滚动条
        */
-      useScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+      isVScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         class: scrollbarWrapperClss
       }, [scrollXVisible === false ? renderEmptyElement($xeList) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         ref: refTrackXElem,
@@ -16254,43 +16325,54 @@ let crossListDragRowObj = null;
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(dataFlag, () => {
       loadData(props.data || []);
     });
-    const reFlag = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)(0);
+    const reScrollFlag = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)(0);
+    const reLayoutFlag = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)(0);
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.height, () => {
-      reFlag.value++;
+      reLayoutFlag.value++;
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.maxHeight, () => {
-      reFlag.value++;
+      reLayoutFlag.value++;
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.syncResize, () => {
-      reFlag.value++;
+      reLayoutFlag.value++;
     });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.useScrollbar, () => {
-      reFlag.value++;
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(computeIsVScrollbar, () => {
+      (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
+        bindScrollbarResize();
+        (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
+          reLayoutFlag.value++;
+        });
+      });
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(computeRowHeight, () => {
-      reFlag.value++;
+      reLayoutFlag.value++;
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(computeScrollYWidth, () => {
-      reFlag.value++;
+      reLayoutFlag.value++;
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(computeScrollXHeight, () => {
-      reFlag.value++;
+      reLayoutFlag.value++;
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(computeScrollXVisible, () => {
       (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
-        reFlag.value++;
+        reLayoutFlag.value++;
       });
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(computeScrollYVisible, () => {
       (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
-        reFlag.value++;
+        reLayoutFlag.value++;
       });
     });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(reFlag, () => {
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(reLayoutFlag, () => {
       recalculate().then(() => {
         recalculate();
       });
     });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(reScrollFlag, () => {
+      updateScrollbar().then(() => {
+        updateScrollbar();
+      });
+    });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.checkRowKey, () => {
       updateRadioModeValue();
     });
@@ -16317,8 +16399,7 @@ let crossListDragRowObj = null;
         showSeq,
         showRadio,
         showCheckbox,
-        autoResize,
-        useScrollbar
+        autoResize
       } = props;
       const rowOpts = computeRowOpts.value;
       const {
@@ -16343,25 +16424,12 @@ let crossListDragRowObj = null;
       if (useKey && !keyField) {
         list_errLog('vxe.error.reqSupportProp', ['row-config.useKey', 'row-config.keyField']);
       }
-      const el = refElem.value;
-      if (useScrollbar) {
-        const viewInnerEl = refVirtualBody.value;
-        const scrollObserver = list_globalResize.create(() => {
-          reFlag.value++;
-        });
-        if (el) {
-          scrollObserver.observe(el);
-        }
-        if (viewInnerEl) {
-          scrollObserver.observe(viewInnerEl);
-        }
-        internalData.scrollObserver = scrollObserver;
-      }
       if (autoResize) {
+        const el = refElem.value;
         const parentEl = getParentElem();
         const resizeObserver = list_globalResize.create(() => {
           if (props.autoResize) {
-            reFlag.value++;
+            reLayoutFlag.value++;
           }
         });
         if (el) {
@@ -16372,9 +16440,10 @@ let crossListDragRowObj = null;
         }
         internalData.resizeObserver = resizeObserver;
       }
-      reFlag.value++;
+      reLayoutFlag.value++;
+      bindScrollbarResize();
       list_globalEvents.on($xeList, 'resize', () => {
-        reFlag.value++;
+        reLayoutFlag.value++;
       });
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onBeforeUnmount)(() => {
@@ -32548,7 +32617,10 @@ const allActiveDrawers = [];
     const $xeForm = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('$xeForm', null);
     const {
       computeSize
-    } = useSize(props);
+    } = useFns.useSize(props);
+    const {
+      computeIsVScrollbar
+    } = useFns.useVScrollbar(props);
     const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refDrawerBox = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refConfirmBtn = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
@@ -32957,16 +33029,16 @@ const allActiveDrawers = [];
       const {
         slots: propSlots = {},
         content,
-        useScrollbar,
         useHtml
       } = props;
+      const isVScrollbar = computeIsVScrollbar.value;
       const scrollbarProps = computeScrollbarProps.value;
       const defaultSlot = slots.default || propSlots.default;
       const leftSlot = slots.left || propSlots.left;
       const rightSlot = slots.right || propSlots.right;
       const contVNs = [];
       if (useHtml && !defaultSlot) {
-        contVNs.push(useScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
+        contVNs.push(isVScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
           key: 'shc',
           class: 'vxe-drawer--scrollbar-content',
           ...scrollbarProps
@@ -32983,7 +33055,7 @@ const allActiveDrawers = [];
           innerHTML: getFuncText(content)
         }));
       } else {
-        contVNs.push(useScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
+        contVNs.push(isVScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
           key: 'sdc',
           class: 'vxe-drawer--scrollbar-content',
           ...scrollbarProps
@@ -38268,7 +38340,10 @@ const ImagePreview = VxeImagePreview;
     const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const {
       computeSize
-    } = useSize(props);
+    } = useFns.useSize(props);
+    const {
+      computeIsVScrollbar
+    } = useFns.useVScrollbar(props);
     const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)({});
     const refMaps = {
       refElem
@@ -38319,11 +38394,11 @@ const ImagePreview = VxeImagePreview;
       const {
         collapsed,
         loading,
-        padding,
-        useScrollbar
+        padding
       } = props;
       const varStyle = computeVarStyle.value;
       const vSize = computeSize.value;
+      const isVScrollbar = computeIsVScrollbar.value;
       const collapseOpts = computeCollapseOpts.value;
       const scrollbarOpts = computeScrollbarOpts.value;
       const {
@@ -38342,7 +38417,7 @@ const ImagePreview = VxeImagePreview;
           'is--loading': loading
         }],
         style: varStyle
-      }, [useScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
+      }, [isVScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
         width: scrollbarOpts.width,
         height: scrollbarOpts.height,
         autoHide: scrollbarOpts.autoHide,
@@ -38435,7 +38510,10 @@ function layout_body_createReactData() {
     const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const {
       computeSize
-    } = useSize(props);
+    } = useFns.useSize(props);
+    const {
+      computeIsVScrollbar
+    } = useFns.useVScrollbar(props);
     const internalData = layout_body_createInternalData();
     const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)(layout_body_createReactData());
     const refMaps = {
@@ -38501,9 +38579,9 @@ function layout_body_createReactData() {
       const {
         loading,
         padding,
-        showBacktop,
-        useScrollbar
+        showBacktop
       } = props;
+      const isVScrollbar = computeIsVScrollbar.value;
       const backtopOpts = computeBacktopOpts.value;
       const scrollbarProps = computeScrollbarProps.value;
       const vSize = computeSize.value;
@@ -38528,7 +38606,7 @@ function layout_body_createReactData() {
           'is--loading': loading,
           'is--padding': padding
         }]
-      }, [useScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, scrollbarProps, {
+      }, [isVScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, scrollbarProps, {
         default: () => defaultSlot ? defaultSlot({}) : []
       }) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         id: showBacktop ? backtopId : '',
@@ -38571,13 +38649,25 @@ const LayoutBody = VxeLayoutBody;
 
 
 
+const {
+  getConfig: layout_container_getConfig,
+  baseUtils: layout_container_baseUtils,
+  createEvent: layout_container_createEvent
+} = VxeUI;
+const {
+  getDefVal: layout_container_getDefVal
+} = layout_container_baseUtils;
 /* harmony default export */ var layout_container = (defineVxeComponent({
   name: 'VxeLayoutContainer',
   props: {
     vertical: Boolean,
+    useScrollbar: {
+      type: Boolean,
+      default: () => layout_container_getDefVal(layout_container_getConfig().layoutContainer.useScrollbar, layout_container_getConfig().useScrollbar)
+    },
     size: {
       type: String,
-      default: () => getConfig().layoutContainer.size || getConfig().size
+      default: () => layout_container_getConfig().layoutContainer.size || layout_container_getConfig().size
     }
   },
   emits: [],
@@ -38590,13 +38680,17 @@ const LayoutBody = VxeLayoutBody;
     const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const {
       computeSize
-    } = useSize(props);
+    } = useFns.useSize(props);
+    const {
+      computeIsVScrollbar
+    } = useFns.useVScrollbar(props);
     const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)({});
     const refMaps = {
       refElem
     };
     const computeMaps = {
-      computeSize
+      computeSize,
+      computeIsVScrollbar
     };
     const $xeLayoutContainer = {
       xID,
@@ -38607,7 +38701,7 @@ const LayoutBody = VxeLayoutBody;
       getComputeMaps: () => computeMaps
     };
     const dispatchEvent = (type, params, evnt) => {
-      emit(type, createEvent(evnt, {
+      emit(type, layout_container_createEvent(evnt, {
         $layoutContainer: $xeLayoutContainer
       }, params));
     };
@@ -38975,6 +39069,7 @@ const {
 } = createComponentLog('menu');
 const {
   menus: menu_menus,
+  useFns: menu_useFns,
   getConfig: menu_getConfig,
   getIcon: menu_getIcon
 } = VxeUI;
@@ -39056,7 +39151,10 @@ let nemuUniqueKey = 100000000;
     const refCollapseBodyScrollbar = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const {
       computeSize
-    } = useSize(props);
+    } = menu_useFns.useSize(props);
+    const {
+      computeIsVScrollbar
+    } = menu_useFns.useVScrollbar(props);
     const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)(menu_createReactData());
     const internalData = menu_createInternalData();
     const refMaps = {
@@ -39685,8 +39783,7 @@ let nemuUniqueKey = 100000000;
       const {
         loading,
         collapseFixed,
-        appendTo,
-        useScrollbar
+        appendTo
       } = props;
       const {
         initialized,
@@ -39695,6 +39792,7 @@ let nemuUniqueKey = 100000000;
         isEnterCollapse
       } = reactData;
       const vSize = computeSize.value;
+      const isVScrollbar = computeIsVScrollbar.value;
       const isCollapsed = computeIsCollapsed.value;
       const currBorder = computeCurrBorder.value;
       const varStyle = computeVarStyle.value;
@@ -39744,7 +39842,7 @@ let nemuUniqueKey = 100000000;
         ...ons
       }, isCollapsed ? [headerSlot ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         class: 'vxe-menu--header'
-      }, headerSlot(stParams)) : renderEmptyElement($xeMenu), useScrollbar && isEnterCollapse ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
+      }, headerSlot(stParams)) : renderEmptyElement($xeMenu), isVScrollbar && isEnterCollapse ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
         ref: refCollapseBodyScrollbar,
         class: 'vxe-menu--scrollbar-body',
         ...scrollbarOpts,
@@ -40094,7 +40192,10 @@ const lockScrollCssWidthKey = '--vxe-ui-modal-lock-scroll-view-width';
     const $xeForm = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('$xeForm', null);
     const {
       computeSize
-    } = useSize(props);
+    } = useFns.useSize(props);
+    const {
+      computeIsVScrollbar
+    } = useFns.useVScrollbar(props);
     const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)(modal_createReactData());
     const internalData = modal_createInternalData();
     const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
@@ -41281,10 +41382,10 @@ const lockScrollCssWidthKey = '--vxe-ui-modal-lock-scroll-view-width';
         status,
         message,
         iconStatus,
-        useScrollbar,
         useHtml
       } = props;
       const content = props.content || message;
+      const isVScrollbar = computeIsVScrollbar.value;
       const isMsg = computeIsMsg.value;
       const scrollbarProps = computeScrollbarProps.value;
       const defaultSlot = slots.default || propSlots.default;
@@ -41299,7 +41400,7 @@ const lockScrollCssWidthKey = '--vxe-ui-modal-lock-scroll-view-width';
         })]));
       }
       if (useHtml && !defaultSlot) {
-        contVNs.push(useScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
+        contVNs.push(isVScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
           key: 'shc',
           class: 'vxe-modal--scrollbar-content',
           ...scrollbarProps
@@ -41316,7 +41417,7 @@ const lockScrollCssWidthKey = '--vxe-ui-modal-lock-scroll-view-width';
           innerHTML: getFuncText(content)
         }));
       } else {
-        contVNs.push(useScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
+        contVNs.push(isVScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
           key: 'sdc',
           class: 'vxe-modal--scrollbar-content',
           ...scrollbarProps
@@ -51190,7 +51291,10 @@ const scrollbarOffsetSize = 20;
     const $xeParentTabs = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('$xeTabs', null);
     const {
       computeSize
-    } = useSize(props);
+    } = useFns.useSize(props);
+    const {
+      computeIsVScrollbar
+    } = useFns.useVScrollbar(props);
     const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refHeadWrapperElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refHeadPrevElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
@@ -51967,9 +52071,6 @@ const scrollbarOffsetSize = 20;
       })) : tabs_renderEmptyElement($xeTabs)]);
     };
     const renderTabPane = item => {
-      const {
-        useScrollbar
-      } = props;
       const {
         initNames,
         activeName
@@ -51980,8 +52081,9 @@ const scrollbarOffsetSize = 20;
       } = item;
       const defaultSlot = slots ? slots.default : null;
       const scrollbarProps = computeScrollbarProps.value;
+      const isVScrollbar = computeIsVScrollbar.value;
       if (name && initNames.includes(name)) {
-        return useScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
+        return isVScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(packages_scrollbar, {
           key: `${name}`,
           class: ['vxe-tabs-pane--scrollbar-item', {
             'is--visible': activeName === name
@@ -53906,11 +54008,15 @@ let crossTreeDragNodeObj = null;
     const xID = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().uniqueId();
     const {
       computeSize
-    } = useSize(props);
+    } = useFns.useSize(props);
+    const {
+      computeIsVScrollbar
+    } = useFns.useVScrollbar(props);
     const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refHeaderWrapperElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refFooterWrapperElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refVirtualWrapper = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
+    const refVirtualSpaceElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refVirtualBody = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refTrackXElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refTrackYElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
@@ -54710,8 +54816,14 @@ let crossTreeDragNodeObj = null;
       });
     };
     const updateScrollbar = () => {
-      updateThumbSize();
-      updateThumbOffset();
+      const isVScrollbar = computeIsVScrollbar.value;
+      if (isVScrollbar) {
+        return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(() => {
+          updateThumbSize();
+          updateThumbOffset();
+        });
+      }
+      return Promise.resolve();
     };
     /**
      * 重新计算列表
@@ -54738,11 +54850,11 @@ let crossTreeDragNodeObj = null;
           const parentPaddingSize = getPaddingTopBottomSize(parentEl);
           reactData.parentHeight = Math.max(headHeight + footHeight + rowHeight, parentEl.clientHeight - parentPaddingSize - headHeight - footHeight);
         }
-        updateScrollbar();
         updateHeight();
         return computeScrollLoad().then(() => {
           updateHeight();
           updateYSpace();
+          updateScrollbar();
         });
       }
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
@@ -54775,7 +54887,7 @@ let crossTreeDragNodeObj = null;
       }
     };
     const scrollEvent = evnt => {
-      const scrollBodyElem = evnt.target;
+      const scrollBodyElem = evnt.currentTarget;
       const scrollTop = scrollBodyElem.scrollTop;
       const scrollLeft = scrollBodyElem.scrollLeft;
       const isX = scrollLeft !== internalData.lastScrollLeft;
@@ -57118,6 +57230,28 @@ let crossTreeDragNodeObj = null;
         hideDropTip();
       }
     };
+    const bindScrollbarResize = () => {
+      const isVScrollbar = computeIsVScrollbar.value;
+      const {
+        scrollObserver
+      } = internalData;
+      if (isVScrollbar) {
+        if (!scrollObserver) {
+          const el = refElem.value;
+          const viewInnerEl = refVirtualSpaceElem.value;
+          const scrollObserver = globalResize.create(() => {
+            reScrollFlag.value++;
+          });
+          if (el) {
+            scrollObserver.observe(el);
+          }
+          if (viewInnerEl) {
+            scrollObserver.observe(viewInnerEl);
+          }
+          internalData.scrollObserver = scrollObserver;
+        }
+      }
+    };
     const updateThumbSize = () => {
       const viewEl = refVirtualWrapper.value;
       if (!viewEl) {
@@ -57639,8 +57773,7 @@ let crossTreeDragNodeObj = null;
       const {
         loading,
         trigger,
-        showLine,
-        useScrollbar
+        showLine
       } = props;
       const {
         bodyHeight,
@@ -57651,6 +57784,7 @@ let crossTreeDragNodeObj = null;
         yThumbHeight
       } = reactData;
       const vSize = computeSize.value;
+      const isVScrollbar = computeIsVScrollbar.value;
       const radioOpts = computeRadioOpts.value;
       const checkboxOpts = computeCheckboxOpts.value;
       const loadingOpts = computeLoadingOpts.value;
@@ -57677,13 +57811,13 @@ let crossTreeDragNodeObj = null;
       }
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         ref: refElem,
-        class: ['vxe-tree', useScrollbar ? `ov-x--${scrollXVisible === false ? 'hidden' : 'visible'}` : '', useScrollbar ? `ov-y--${scrollYVisible === false ? 'hidden' : 'visible'}` : '', useScrollbar ? `sx-pos--${scrollbarXToTop ? 'top' : 'bottom'}` : '', useScrollbar ? `sy-pos--${scrollbarYToLeft ? 'left' : 'right'}` : '', {
+        class: ['vxe-tree', isVScrollbar ? `ov-x--${scrollXVisible === false ? 'hidden' : 'visible'}` : '', isVScrollbar ? `ov-y--${scrollYVisible === false ? 'hidden' : 'visible'}` : '', isVScrollbar ? `sx-pos--${scrollbarXToTop ? 'top' : 'bottom'}` : '', isVScrollbar ? `sy-pos--${scrollbarYToLeft ? 'left' : 'right'}` : '', {
           [`size--${vSize}`]: vSize,
           'show--line': showLine,
-          'is--virtual-scrollbar': useScrollbar,
-          'ov-padding': useScrollbar && scrollbarOpts.padding,
-          'ov-x--auto-hide': useScrollbar && scrollXAutoHide,
-          'ov-y--auto-hide': useScrollbar && scrollYAutoHide,
+          '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,
           'checkbox--highlight': checkboxOpts.highlight,
@@ -57705,6 +57839,7 @@ let crossTreeDragNodeObj = null;
         style: treeStyle,
         onScroll: scrollEvent
       }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        ref: refVirtualSpaceElem,
         class: 'vxe-tree--y-space',
         style: {
           height: bodyHeight ? `${bodyHeight}px` : ''
@@ -57724,7 +57859,7 @@ let crossTreeDragNodeObj = null;
       /**
        * 滚动条
        */
-      useScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+      isVScrollbar ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         class: scrollbarWrapperClss
       }, [scrollXVisible === false ? renderEmptyElement($xeTree) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         ref: refTrackXElem,
@@ -57834,40 +57969,51 @@ let crossTreeDragNodeObj = null;
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.filterValue, () => {
       triggerSearchEvent(new Event('filter'));
     });
-    const reFlag = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)(0);
+    const reScrollFlag = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)(0);
+    const reLayoutFlag = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)(0);
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.height, () => {
-      reFlag.value++;
+      reLayoutFlag.value++;
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.minHeight, () => {
-      reFlag.value++;
+      reLayoutFlag.value++;
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.maxHeight, () => {
-      reFlag.value++;
+      reLayoutFlag.value++;
     });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.useScrollbar, () => {
-      reFlag.value++;
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(computeIsVScrollbar, () => {
+      (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
+        bindScrollbarResize();
+        (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
+          reLayoutFlag.value++;
+        });
+      });
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(computeScrollYWidth, () => {
-      reFlag.value++;
+      reLayoutFlag.value++;
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(computeScrollXHeight, () => {
-      reFlag.value++;
+      reLayoutFlag.value++;
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(computeScrollXVisible, () => {
       (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
-        reFlag.value++;
+        reLayoutFlag.value++;
       });
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(computeScrollYVisible, () => {
       (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
-        reFlag.value++;
+        reLayoutFlag.value++;
       });
     });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(reFlag, () => {
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(reLayoutFlag, () => {
       recalculate().then(() => {
         recalculate();
       });
     });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(reScrollFlag, () => {
+      updateScrollbar().then(() => {
+        updateScrollbar();
+      });
+    });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onMounted)(() => {
       const {
         transform,
@@ -57876,8 +58022,7 @@ let crossTreeDragNodeObj = null;
         showOverflow,
         lazy,
         loadMethod,
-        autoResize,
-        useScrollbar
+        autoResize
       } = props;
       const dragOpts = computeDragOpts.value;
       if (!showOverflow) {
@@ -57899,25 +58044,12 @@ let crossTreeDragNodeObj = null;
       if (menuConfig && !VxeUIContextMenu) {
         tree_errLog('vxe.error.reqComp', ['vxe-context-menu']);
       }
-      const el = refElem.value;
-      if (useScrollbar || autoResize) {
-        const viewInnerEl = refVirtualBody.value;
-        const scrollObserver = globalResize.create(() => {
-          updateScrollbar();
-        });
-        if (el) {
-          scrollObserver.observe(el);
-        }
-        if (viewInnerEl) {
-          scrollObserver.observe(viewInnerEl);
-        }
-        internalData.scrollObserver = scrollObserver;
-      }
       if (autoResize) {
+        const el = refElem.value;
         const parentEl = getParentElem();
         const resizeObserver = globalResize.create(() => {
           if (props.autoResize) {
-            reFlag.value++;
+            reLayoutFlag.value++;
           }
         });
         if (el) {
@@ -57928,9 +58060,10 @@ let crossTreeDragNodeObj = null;
         }
         internalData.resizeObserver = resizeObserver;
       }
-      reFlag.value++;
+      reLayoutFlag.value++;
+      bindScrollbarResize();
       globalEvents.on($xeTree, 'resize', () => {
-        reFlag.value++;
+        reLayoutFlag.value++;
       });
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onBeforeUnmount)(() => {