vxe-table 4.10.6-beta.6 → 4.10.6-beta.8

package/lib/table/src/header.min.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_util=require("./util"),_dom=require("../../ui/src/dom");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let{getI18n,renderer,renderEmptyElement}=_ui.VxeUI,renderType="header";var _default=exports.default=(0,_vue.defineComponent)({name:"VxeTableHeader",props:{tableData:Array,tableColumn:Array,tableGroupColumn:Array,fixedColumn:Array,fixedType:{type:String,default:null}},setup(V){let Y=(0,_vue.inject)("$xeTable",{}),{xID:h,props:m,reactData:K,internalData:J}=Y,{refElem:r,refLeftContainer:d,refRightContainer:s,refCellResizeBar:u,refCellResizeTip:c}=Y.getRefMaps(),{computeColumnOpts:g,computeColumnDragOpts:x,computeResizableOpts:v}=Y.getComputeMaps(),_=(0,_vue.ref)([]),S=(0,_vue.ref)(),b=(0,_vue.ref)(),C=(0,_vue.ref)(),y=(0,_vue.ref)(),w=(0,_vue.ref)(),D=(0,_vue.ref)(),M=(0,_vue.ref)(),t=()=>{var e=K.isGroup;_.value=e?(0,_util.convertHeaderColumnToRows)(V.tableGroupColumn):[]},Q=(e,a)=>{var l=a.column;let f=V.fixedType,{elemStore:t,visibleColumn:i}=J,h=v.value,m=r.value,g=d.value,x=s.value,_=u.value,b=c.value,C=e.clientX,y=S.value;var n=e.target;let w=l,D=(l.children&&l.children.length&&_xeUtils.default.eachTree(l.children,e=>{w=e}),n.parentNode);l=Object.assign(a,{cell:D});let M=0,E=(0,_util.getRefElem)(t["main-body-scroll"]);if(E){var o=(0,_dom.getOffsetPos)(n,y),n=n.clientWidth,T=Math.floor(n/2);let d=(0,_util.getColReMinWidth)(l)-T,s=o.left-D.clientWidth+n+d,u=o.left+T,t=document.onmousemove,r=document.onmouseup,c="left"===f,v="right"===f,p=0;if(c||v){var z=c?"nextElementSibling":"previousElementSibling";let e=D[z];for(;e&&!(0,_dom.hasClass)(e,"fixed--hidden");)(0,_dom.hasClass)(e,"col--group")||(p+=e.offsetWidth),e=e[z];v&&x&&(u=x.offsetLeft+p)}l=l=>{l.stopPropagation(),l.preventDefault();var t=l.clientX-C;let e=u+t;t=f?0:E.scrollLeft,c?e=Math.min(e,(x?x.offsetLeft:E.clientWidth)-p-d):v?(s=(g?g.clientWidth:0)+p+d,e=Math.min(e,u+D.clientWidth-d)):s=Math.max(E.scrollLeft,s),M=Math.max(e,s),t=Math.max(1,M-t);if(_.style.left=t+"px",h.showDragTip&&b){var r=m.clientWidth,a=y.getBoundingClientRect(),i=_.clientWidth,n=b.clientWidth,o=b.clientHeight;let e=-n;t<n+i?e=0:r<t&&(e+=r-t),b.style.left=e+"px",b.style.top=Math.min(m.clientHeight-o,Math.max(0,l.clientY-a.y-o/2))+"px",b.textContent=getI18n("vxe.table.resizeColTip",[w.renderWidth+(v?u-M:M-u)])}};K._isResize=!0,(0,_dom.addClass)(m,"drag--resize"),_.style.display="block",document.onmousemove=l,document.onmouseup=function(e){document.onmousemove=t,document.onmouseup=r;let l=w.renderWidth+(v?u-M:M-u);w.resizeWidth=l,"fixed"===h.dragMode&&i.forEach(e=>{e.id===w.id||e.resizeWidth||(e.resizeWidth=e.renderWidth)}),_.style.display="none",K._isResize=!1,J._lastResizeTime=Date.now(),Y.analyColumnWidth(),Y.recalculate(!0).then(()=>{Y.saveCustomStore("update:visible"),Y.updateCellAreas(),Y.dispatchEvent("resizable-change",Object.assign(Object.assign({},a),{resizeWidth:l}),e),setTimeout(()=>Y.recalculate(!0),300)}),(0,_dom.removeClass)(m,"drag--resize")},l(e),Y.closeMenu&&Y.closeMenu()}},E=(D,M,E,T)=>{let z=V.fixedType,{resizable:S,border:W,columnKey:R,headerCellClassName:H,headerCellStyle:I,showHeaderOverflow:O,headerAlign:k,align:U,mouseConfig:$}=m,{currentColumn:A,scrollXLoad:F,scrollYLoad:L,overflowX:j}=K,q=J.scrollXStore,X=g.value,G=x.value,{disabledMethod:N,isCrossDrag:P,isPeerDrag:B}=G;return E.map((e,l)=>{var{type:t,showHeaderOverflow:r,headerAlign:a,align:i,filters:n,headerClassName:o,editRender:d,cellRender:s}=e,u=e.id,d=d||s,s=d?renderer.get(d.name):null,d=e.children&&e.children.length,c=z?e.fixed!==z&&!d:!!e.fixed&&j,r=_xeUtils.default.eqNull(r)?O:r,a=a||(s?s.tableHeaderCellAlign:"")||k||i||(s?s.tableCellAlign:"")||U;let v="ellipsis"===r;i="title"===r,s=!0===r||"tooltip"===r;let p=i||s||v,f=!1,h=null;n&&(h=n[0],f=n.some(e=>e.checked));var r=Y.getColumnIndex(e),m=Y.getVTColumnIndex(e);let g={$table:Y,$grid:Y.xegrid,$rowIndex:T,column:e,columnIndex:r,$columnIndex:l,_columnIndex:m,firstFilterOption:h,fixed:z,type:renderType,isHidden:c,hasFilter:f};var r={colid:u,colspan:1<e.colSpan?e.colSpan:null,rowspan:1<e.rowSpan?e.rowSpan:null},x={onClick:e=>Y.triggerHeaderCellClickEvent(e,g),onDblclick:e=>Y.triggerHeaderCellDblclickEvent(e,g)},_=(F&&!p&&(v=p=!0),X.drag&&"cell"===G.trigger);let b=!1;_&&(b=!(!N||!N(g))),($||_)&&(x.onMousedown=e=>Y.triggerHeaderCellMousedownEvent(e,g)),X.drag&&(x.onDragstart=Y.handleHeaderCellDragDragstartEvent,x.onDragend=Y.handleHeaderCellDragDragendEvent,x.onDragover=Y.handleHeaderCellDragDragoverEvent,_)&&(x.onMouseup=Y.handleHeaderCellDragMouseupEvent);var _=l===E.length-1,C=_xeUtils.default.isBoolean(e.resizable)?e.resizable:X.resizable||S,y=!e.resizeWidth&&("auto"===e.minWidth||"auto"===e.width);let w=!1;return F&&!D&&!e.fixed&&(m<q.visibleStartIndex||m>q.visibleEndIndex)&&(w=!0),(0,_vue.h)("th",Object.assign(Object.assign(Object.assign({class:["vxe-header--column",u,{["col--"+a]:a,["col--"+t]:t,"col--last":_,"col--fixed":e.fixed,"col--group":d,"col--ellipsis":p,"fixed--width":!y,"fixed--hidden":c,"is--sortable":e.sortable,"col--filter":!!n,"is--filter-active":f,"is--drag-active":!e.fixed&&!b&&(P||B||!e.parentId),"is--drag-disabled":b,"col--current":A===e},o?_xeUtils.default.isFunction(o)?o(g):o:"",H?_xeUtils.default.isFunction(H)?H(g):H:""],style:I?_xeUtils.default.isFunction(I)?I(g):I:null},r),x),{key:R||F||L||X.useKey||X.drag||d?u:l}),[(0,_vue.h)("div",{class:["vxe-cell",{"c--title":i,"c--tooltip":s,"c--ellipsis":v}]},w||M&&c?[]:e.renderHeader(g)),!c&&C?(0,_vue.h)("div",{class:["vxe-resizable",{"is--line":!W||"none"===W}],onMousedown:e=>Q(e,g),onDblclick:e=>Y.handleResizeDblclickEvent(e,g)}):renderEmptyElement(Y)])})};return(0,_vue.watch)(()=>V.tableColumn,t),(0,_vue.onMounted)(()=>{(0,_vue.nextTick)(()=>{var e=V.fixedType,l=Y.internalData,l=l.elemStore,e=`${e||"main"}-header-`;l[e+"wrapper"]=S,l[e+"scroll"]=b,l[e+"table"]=C,l[e+"colgroup"]=y,l[e+"list"]=w,l[e+"xSpace"]=D,l[e+"repair"]=M,t()})}),(0,_vue.onUnmounted)(()=>{var e=V.fixedType,l=Y.internalData,l=l.elemStore,e=`${e||"main"}-header-`;l[e+"wrapper"]=null,l[e+"scroll"]=null,l[e+"table"]=null,l[e+"colgroup"]=null,l[e+"list"]=null,l[e+"xSpace"]=null,l[e+"repair"]=null}),()=>{let{fixedType:l,fixedColumn:e,tableColumn:t}=V;var{showHeaderOverflow:r,spanMethod:a,footerSpanMethod:i}=m,{isGroup:n,scrollXLoad:o,scrollYLoad:d,dragCol:s}=K,{visibleColumn:u,fullColumnIdData:c}=J;let v=_.value,p=t,f=!1;return n?p=u:(!(o||d||r)||a||i||(f=!0),l&&(p=u,f)&&(p=e||[]),v=[p]),l||n||o&&s&&2<p.length&&(d=c[s.id])&&(r=d._index,a=p[0],i=p[p.length-1],u=c[a.id],o=c[i.id],u)&&o&&(d=u._index,a=o._index,r<d?(p=[s].concat(p),v=[[s].concat(v[0])].concat(v.slice(1))):a<r&&(p=p.concat([s]),v=[v[0].concat([s])].concat(v.slice(1)))),(0,_vue.h)("div",{ref:S,class:["vxe-table--header-wrapper",l?`fixed-${l}--wrapper`:"body--wrapper"],xid:h},[(0,_vue.h)("div",{ref:b,class:"vxe-table--header-inner-wrapper",onScroll(e){Y.triggerHeaderScrollEvent(e,l)}},[l?renderEmptyElement(Y):(0,_vue.h)("div",{ref:D,class:"vxe-body--x-space"}),(0,_vue.h)("table",{ref:C,class:"vxe-table--header",xid:h,cellspacing:0,cellpadding:0,border:0},[(0,_vue.h)("colgroup",{ref:y},p.map((e,l)=>(0,_vue.h)("col",{name:e.id,key:l}))),(0,_vue.h)("thead",{ref:w},((r,a,e)=>{let i=V.fixedType,{headerRowClassName:n,headerRowStyle:o}=m,d=K.isDragColMove,s=g.value,u=x.value;return e.map((e,l)=>{var t={$table:Y,$rowIndex:l,fixed:i,type:renderType};return s.drag&&u.animation?(0,_vue.h)(_vue.TransitionGroup,{key:l,name:"vxe-header--col-list"+(d?"":"-disabled"),tag:"tr",class:["vxe-header--row",n?_xeUtils.default.isFunction(n)?n(t):n:""],style:o?_xeUtils.default.isFunction(o)?o(t):o:null},{default:()=>E(r,a,e,l)}):(0,_vue.h)("tr",{key:l,class:["vxe-header--row",n?_xeUtils.default.isFunction(n)?n(t):n:""],style:o?_xeUtils.default.isFunction(o)?o(t):o:null},E(r,a,e,l))})})(n,f,v))])]),(0,_vue.h)("div",{ref:M,class:"vxe-table--header-border-line"})])}}});
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_util=require("./util"),_dom=require("../../ui/src/dom");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let{getI18n,renderer,renderEmptyElement}=_ui.VxeUI,renderType="header";var _default=exports.default=(0,_vue.defineComponent)({name:"VxeTableHeader",props:{tableData:Array,tableColumn:Array,tableGroupColumn:Array,fixedColumn:Array,fixedType:{type:String,default:null}},setup(V){let Y=(0,_vue.inject)("$xeTable",{}),{xID:f,props:m,reactData:K,internalData:J}=Y,{refElem:r,refLeftContainer:s,refRightContainer:u,refCellResizeBar:c,refCellResizeTip:v}=Y.getRefMaps(),{computeColumnOpts:g,computeColumnDragOpts:x,computeResizableOpts:p,computeScrollbarXToTop:h}=Y.getComputeMaps(),_=(0,_vue.ref)([]),H=(0,_vue.ref)(),b=(0,_vue.ref)(),C=(0,_vue.ref)(),y=(0,_vue.ref)(),w=(0,_vue.ref)(),D=(0,_vue.ref)(),M=(0,_vue.ref)(),t=()=>{var e=K.isGroup;_.value=e?(0,_util.convertHeaderColumnToRows)(V.tableGroupColumn):[]},Q=(e,a)=>{var l=a.column;let f=V.fixedType,m=K.scrollbarHeight,{elemStore:t,visibleColumn:i}=J,g=p.value,x=r.value,_=s.value,b=u.value,C=c.value,y=v.value,w=h.value,D=e.clientX,M=H.value;var n=e.target;let T=l,E=(l.children&&l.children.length&&_xeUtils.default.eachTree(l.children,e=>{T=e}),n.parentNode);l=Object.assign(a,{cell:E});let z=0,S=(0,_util.getRefElem)(t["main-body-scroll"]);if(S){var o=(0,_dom.getOffsetPos)(n,M),n=n.clientWidth,d=Math.floor(n/2);let s=(0,_util.getColReMinWidth)(l)-d,u=o.left-E.clientWidth+n+s,c=o.left+d,t=document.onmousemove,r=document.onmouseup,v="left"===f,p="right"===f,h=0;if(v||p){var W=v?"nextElementSibling":"previousElementSibling";let e=E[W];for(;e&&!(0,_dom.hasClass)(e,"fixed--hidden");)(0,_dom.hasClass)(e,"col--group")||(h+=e.offsetWidth),e=e[W];p&&b&&(c=b.offsetLeft+h)}l=l=>{l.stopPropagation(),l.preventDefault();var t=x.clientHeight,r=l.clientX-D;let e=c+r;r=f?0:S.scrollLeft,v?e=Math.min(e,(b?b.offsetLeft:S.clientWidth)-h-s):p?(u=(_?_.clientWidth:0)+h+s,e=Math.min(e,c+E.clientWidth-s)):u=Math.max(S.scrollLeft,u),z=Math.max(e,u),r=Math.max(1,z-r);if(C.style.left=r+"px",C.style.top=`${w?m:0}px`,C.style.height=`${w?t-m:t}px`,g.showDragTip&&y){var a=x.clientWidth,i=M.getBoundingClientRect(),n=C.clientWidth,o=y.clientWidth,d=y.clientHeight;let e=-o;r<o+n?e=0:a<r&&(e+=a-r),y.style.left=e+"px",y.style.top=Math.min(t-d,Math.max(0,l.clientY-i.y-d/2))+"px",y.textContent=getI18n("vxe.table.resizeColTip",[T.renderWidth+(p?c-z:z-c)])}};K._isResize=!0,(0,_dom.addClass)(x,"drag--resize"),C.style.display="block",document.onmousemove=l,document.onmouseup=function(e){document.onmousemove=t,document.onmouseup=r;let l=T.renderWidth+(p?c-z:z-c);T.resizeWidth=l,"fixed"===g.dragMode&&i.forEach(e=>{e.id===T.id||e.resizeWidth||(e.resizeWidth=e.renderWidth)}),C.style.display="none",K._isResize=!1,J._lastResizeTime=Date.now(),Y.analyColumnWidth(),Y.recalculate(!0).then(()=>{Y.saveCustomStore("update:visible"),Y.updateCellAreas(),Y.dispatchEvent("resizable-change",Object.assign(Object.assign({},a),{resizeWidth:l}),e),setTimeout(()=>Y.recalculate(!0),300)}),(0,_dom.removeClass)(x,"drag--resize")},l(e),Y.closeMenu&&Y.closeMenu()}},T=(D,M,T,E)=>{let z=V.fixedType,{resizable:S,border:W,columnKey:H,headerCellClassName:R,headerCellStyle:I,showHeaderOverflow:O,headerAlign:k,align:U,mouseConfig:$}=m,{currentColumn:A,scrollXLoad:F,scrollYLoad:L,overflowX:j}=K,q=J.scrollXStore,X=g.value,G=x.value,{disabledMethod:N,isCrossDrag:P,isPeerDrag:B}=G;return T.map((e,l)=>{var{type:t,showHeaderOverflow:r,headerAlign:a,align:i,filters:n,headerClassName:o,editRender:d,cellRender:s}=e,u=e.id,d=d||s,s=d?renderer.get(d.name):null,d=e.children&&e.children.length,c=z?e.fixed!==z&&!d:!!e.fixed&&j,r=_xeUtils.default.eqNull(r)?O:r,a=a||(s?s.tableHeaderCellAlign:"")||k||i||(s?s.tableCellAlign:"")||U;let v="ellipsis"===r;i="title"===r,s=!0===r||"tooltip"===r;let p=i||s||v,h=!1,f=null;n&&(f=n[0],h=n.some(e=>e.checked));var r=Y.getColumnIndex(e),m=Y.getVTColumnIndex(e);let g={$table:Y,$grid:Y.xegrid,$rowIndex:E,column:e,columnIndex:r,$columnIndex:l,_columnIndex:m,firstFilterOption:f,fixed:z,type:renderType,isHidden:c,hasFilter:h};var r={colid:u,colspan:1<e.colSpan?e.colSpan:null,rowspan:1<e.rowSpan?e.rowSpan:null},x={onClick:e=>Y.triggerHeaderCellClickEvent(e,g),onDblclick:e=>Y.triggerHeaderCellDblclickEvent(e,g)},_=(F&&!p&&(v=p=!0),X.drag&&"cell"===G.trigger);let b=!1;_&&(b=!(!N||!N(g))),($||_)&&(x.onMousedown=e=>Y.triggerHeaderCellMousedownEvent(e,g)),X.drag&&(x.onDragstart=Y.handleHeaderCellDragDragstartEvent,x.onDragend=Y.handleHeaderCellDragDragendEvent,x.onDragover=Y.handleHeaderCellDragDragoverEvent,_)&&(x.onMouseup=Y.handleHeaderCellDragMouseupEvent);var _=l===T.length-1,C=_xeUtils.default.isBoolean(e.resizable)?e.resizable:X.resizable||S,y=!e.resizeWidth&&("auto"===e.minWidth||"auto"===e.width);let w=!1;return F&&!D&&!e.fixed&&(m<q.visibleStartIndex||m>q.visibleEndIndex)&&(w=!0),(0,_vue.h)("th",Object.assign(Object.assign(Object.assign({class:["vxe-header--column",u,{["col--"+a]:a,["col--"+t]:t,"col--last":_,"col--fixed":e.fixed,"col--group":d,"col--ellipsis":p,"fixed--width":!y,"fixed--hidden":c,"is--sortable":e.sortable,"col--filter":!!n,"is--filter-active":h,"is--drag-active":!e.fixed&&!b&&(P||B||!e.parentId),"is--drag-disabled":b,"col--current":A===e},o?_xeUtils.default.isFunction(o)?o(g):o:"",R?_xeUtils.default.isFunction(R)?R(g):R:""],style:I?_xeUtils.default.isFunction(I)?I(g):I:null},r),x),{key:H||F||L||X.useKey||X.drag||d?u:l}),[(0,_vue.h)("div",{class:["vxe-cell",{"c--title":i,"c--tooltip":s,"c--ellipsis":v}]},w||M&&c?[]:e.renderHeader(g)),!c&&C?(0,_vue.h)("div",{class:["vxe-resizable",{"is--line":!W||"none"===W}],onMousedown:e=>Q(e,g),onDblclick:e=>Y.handleResizeDblclickEvent(e,g)}):renderEmptyElement(Y)])})};return(0,_vue.watch)(()=>V.tableColumn,t),(0,_vue.onMounted)(()=>{(0,_vue.nextTick)(()=>{var e=V.fixedType,l=Y.internalData,l=l.elemStore,e=`${e||"main"}-header-`;l[e+"wrapper"]=H,l[e+"scroll"]=b,l[e+"table"]=C,l[e+"colgroup"]=y,l[e+"list"]=w,l[e+"xSpace"]=D,l[e+"repair"]=M,t()})}),(0,_vue.onUnmounted)(()=>{var e=V.fixedType,l=Y.internalData,l=l.elemStore,e=`${e||"main"}-header-`;l[e+"wrapper"]=null,l[e+"scroll"]=null,l[e+"table"]=null,l[e+"colgroup"]=null,l[e+"list"]=null,l[e+"xSpace"]=null,l[e+"repair"]=null}),()=>{let{fixedType:l,fixedColumn:e,tableColumn:t}=V;var{showHeaderOverflow:r,spanMethod:a,footerSpanMethod:i}=m,{isGroup:n,scrollXLoad:o,scrollYLoad:d,dragCol:s}=K,{visibleColumn:u,fullColumnIdData:c}=J;let v=_.value,p=t,h=!1;return n?p=u:(!(o||d||r)||a||i||(h=!0),l&&(p=u,h)&&(p=e||[]),v=[p]),l||n||o&&s&&2<p.length&&(d=c[s.id])&&(r=d._index,a=p[0],i=p[p.length-1],u=c[a.id],o=c[i.id],u)&&o&&(d=u._index,a=o._index,r<d?(p=[s].concat(p),v=[[s].concat(v[0])].concat(v.slice(1))):a<r&&(p=p.concat([s]),v=[v[0].concat([s])].concat(v.slice(1)))),(0,_vue.h)("div",{ref:H,class:["vxe-table--header-wrapper",l?`fixed-${l}--wrapper`:"body--wrapper"],xid:f},[(0,_vue.h)("div",{ref:b,class:"vxe-table--header-inner-wrapper",onScroll(e){Y.triggerHeaderScrollEvent(e,l)}},[l?renderEmptyElement(Y):(0,_vue.h)("div",{ref:D,class:"vxe-body--x-space"}),(0,_vue.h)("table",{ref:C,class:"vxe-table--header",xid:f,cellspacing:0,cellpadding:0,border:0},[(0,_vue.h)("colgroup",{ref:y},p.map((e,l)=>(0,_vue.h)("col",{name:e.id,key:l}))),(0,_vue.h)("thead",{ref:w},((r,a,e)=>{let i=V.fixedType,{headerRowClassName:n,headerRowStyle:o}=m,d=K.isDragColMove,s=g.value,u=x.value;return e.map((e,l)=>{var t={$table:Y,$rowIndex:l,fixed:i,type:renderType};return s.drag&&u.animation?(0,_vue.h)(_vue.TransitionGroup,{key:l,name:"vxe-header--col-list"+(d?"":"-disabled"),tag:"tr",class:["vxe-header--row",n?_xeUtils.default.isFunction(n)?n(t):n:""],style:o?_xeUtils.default.isFunction(o)?o(t):o:null},{default:()=>T(r,a,e,l)}):(0,_vue.h)("tr",{key:l,class:["vxe-header--row",n?_xeUtils.default.isFunction(n)?n(t):n:""],style:o?_xeUtils.default.isFunction(o)?o(t):o:null},T(r,a,e,l))})})(n,h,v))])]),(0,_vue.h)("div",{ref:M,class:"vxe-table--header-border-line"})])}}});

package/lib/table/src/table.js

@@ -393,9 +393,12 @@ var _default = exports.default = (0, _vue.defineComponent)({
     const refScrollXVirtualElem = (0, _vue.ref)();
     const refScrollYVirtualElem = (0, _vue.ref)();
     const refScrollXHandleElem = (0, _vue.ref)();
+    const refScrollXLeftCornerElem = (0, _vue.ref)();
     const refScrollXRightCornerElem = (0, _vue.ref)();
     const refScrollYHandleElem = (0, _vue.ref)();
     const refScrollYTopCornerElem = (0, _vue.ref)();
+    const refScrollXWrapperElem = (0, _vue.ref)();
+    const refScrollYWrapperElem = (0, _vue.ref)();
     const refScrollYBottomCornerElem = (0, _vue.ref)();
     const refScrollXSpaceElem = (0, _vue.ref)();
     const refScrollYSpaceElem = (0, _vue.ref)();
@@ -452,6 +455,14 @@ var _default = exports.default = (0, _vue.defineComponent)({
     const computeScrollbarOpts = (0, _vue.computed)(() => {
       return Object.assign({}, getConfig().table.scrollbarConfig, props.scrollbarConfig);
     });
+    const computeScrollbarXToTop = (0, _vue.computed)(() => {
+      const scrollbarOpts = computeScrollbarOpts.value;
+      return !!(scrollbarOpts.x && scrollbarOpts.x.position === 'top');
+    });
+    const computeScrollbarYToLeft = (0, _vue.computed)(() => {
+      const scrollbarOpts = computeScrollbarOpts.value;
+      return !!(scrollbarOpts.y && scrollbarOpts.y.position === 'left');
+    });
     const computeScrollYThreshold = (0, _vue.computed)(() => {
       const sYOpts = computeSYOpts.value;
       const {
@@ -756,6 +767,8 @@ var _default = exports.default = (0, _vue.defineComponent)({
       computeVirtualXOpts,
       computeVirtualYOpts,
       computeScrollbarOpts,
+      computeScrollbarXToTop,
+      computeScrollbarYToLeft,
       computeColumnOpts,
       computeScrollXThreshold,
       computeScrollYThreshold,
@@ -2045,19 +2058,26 @@ var _default = exports.default = (0, _vue.defineComponent)({
         }
         bodyHeight = Math.max(bodyMinHeight, bodyHeight);
       }
+      const xLeftCornerEl = refScrollXLeftCornerElem.value;
+      const xRightCornerEl = refScrollXRightCornerElem.value;
+      const scrollbarXToTop = computeScrollbarXToTop.value;
       const scrollXVirtualEl = refScrollXVirtualElem.value;
       if (scrollXVirtualEl) {
         scrollXVirtualEl.style.height = `${scrollbarHeight}px`;
         scrollXVirtualEl.style.visibility = scrollbarHeight ? 'visible' : 'hidden';
       }
-      const xHandleEl = refScrollXHandleElem.value;
-      if (xHandleEl) {
-        xHandleEl.style.width = `${el.clientWidth - scrollbarWidth}px`;
+      const xWrapperEl = refScrollXWrapperElem.value;
+      if (xWrapperEl) {
+        xWrapperEl.style.left = scrollbarXToTop ? `${scrollbarWidth}px` : '';
+        xWrapperEl.style.width = `${el.clientWidth - scrollbarWidth}px`;
+      }
+      if (xLeftCornerEl) {
+        xLeftCornerEl.style.width = scrollbarXToTop ? `${scrollbarWidth}px` : '';
+        xLeftCornerEl.style.display = scrollbarXToTop ? scrollbarWidth && scrollbarHeight ? 'block' : '' : '';
       }
-      const xRightCornerEl = refScrollXRightCornerElem.value;
       if (xRightCornerEl) {
-        xRightCornerEl.style.width = `${scrollbarWidth}px`;
-        xRightCornerEl.style.display = scrollbarWidth && scrollbarHeight ? 'block' : '';
+        xRightCornerEl.style.width = scrollbarXToTop ? '' : `${scrollbarWidth}px`;
+        xRightCornerEl.style.display = scrollbarXToTop ? '' : scrollbarWidth && scrollbarHeight ? 'block' : '';
       }
       const scrollYVirtualEl = refScrollYVirtualElem.value;
       if (scrollYVirtualEl) {
@@ -2070,10 +2090,10 @@ var _default = exports.default = (0, _vue.defineComponent)({
         yTopCornerEl.style.height = `${headerHeight}px`;
         yTopCornerEl.style.display = headerHeight ? 'block' : '';
       }
-      const yHandleEl = refScrollYHandleElem.value;
-      if (yHandleEl) {
-        yHandleEl.style.height = `${bodyHeight}px`;
-        yHandleEl.style.top = `${headerHeight}px`;
+      const yWrapperEl = refScrollYWrapperElem.value;
+      if (yWrapperEl) {
+        yWrapperEl.style.height = `${bodyHeight}px`;
+        yWrapperEl.style.top = `${headerHeight}px`;
       }
       const yBottomCornerEl = refScrollYBottomCornerElem.value;
       if (yBottomCornerEl) {
@@ -3651,86 +3671,6 @@ var _default = exports.default = (0, _vue.defineComponent)({
         loadScrollYData();
       }, fpsTime);
     };
-    const scrollXEvent = evnt => {
-      const {
-        elemStore,
-        inWheelScroll,
-        lastScrollTop,
-        inHeaderScroll,
-        inBodyScroll,
-        inFooterScroll
-      } = internalData;
-      if (inHeaderScroll || inBodyScroll || inFooterScroll) {
-        return;
-      }
-      if (inWheelScroll) {
-        return;
-      }
-      const headerScrollElem = (0, _util.getRefElem)(elemStore['main-header-scroll']);
-      const bodyScrollElem = (0, _util.getRefElem)(elemStore['main-body-scroll']);
-      const footerScrollElem = (0, _util.getRefElem)(elemStore['main-footer-scroll']);
-      const yHandleEl = refScrollYHandleElem.value;
-      const wrapperEl = evnt.currentTarget;
-      const {
-        scrollLeft
-      } = wrapperEl;
-      const yBodyEl = yHandleEl || bodyScrollElem;
-      let scrollTop = 0;
-      if (yBodyEl) {
-        scrollTop = yBodyEl.scrollTop;
-      }
-      const isRollX = true;
-      const isRollY = scrollTop !== lastScrollTop;
-      internalData.inVirtualScroll = true;
-      (0, _dom.setScrollLeft)(bodyScrollElem, scrollLeft);
-      (0, _dom.setScrollLeft)(headerScrollElem, scrollLeft);
-      (0, _dom.setScrollLeft)(footerScrollElem, scrollLeft);
-      $xeTable.triggerScrollXEvent(evnt);
-      $xeTable.handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, {
-        type: 'table',
-        fixed: ''
-      });
-    };
-    const scrollYEvent = evnt => {
-      const {
-        elemStore,
-        inWheelScroll,
-        lastScrollLeft,
-        inHeaderScroll,
-        inBodyScroll,
-        inFooterScroll
-      } = internalData;
-      if (inHeaderScroll || inBodyScroll || inFooterScroll) {
-        return;
-      }
-      if (inWheelScroll) {
-        return;
-      }
-      const leftScrollElem = (0, _util.getRefElem)(elemStore['left-body-scroll']);
-      const bodyScrollElem = (0, _util.getRefElem)(elemStore['main-body-scroll']);
-      const rightScrollElem = (0, _util.getRefElem)(elemStore['right-body-scroll']);
-      const xHandleEl = refScrollXHandleElem.value;
-      const wrapperEl = evnt.currentTarget;
-      const {
-        scrollTop
-      } = wrapperEl;
-      const xBodyEl = xHandleEl || bodyScrollElem;
-      let scrollLeft = 0;
-      if (xBodyEl) {
-        scrollLeft = xBodyEl.scrollLeft;
-      }
-      const isRollX = scrollLeft !== lastScrollLeft;
-      const isRollY = true;
-      internalData.inVirtualScroll = true;
-      (0, _dom.setScrollTop)(bodyScrollElem, scrollTop);
-      (0, _dom.setScrollTop)(leftScrollElem, scrollTop);
-      (0, _dom.setScrollTop)(rightScrollElem, scrollTop);
-      $xeTable.triggerScrollYEvent(evnt);
-      $xeTable.handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, {
-        type: 'table',
-        fixed: ''
-      });
-    };
     const checkLastSyncScroll = (isRollX, isRollY) => {
       const {
         scrollXLoad,
@@ -3782,6 +3722,12 @@ var _default = exports.default = (0, _vue.defineComponent)({
       }
       return (0, _vue.nextTick)();
     };
+    function handleUupdateResize() {
+      const el = refElem.value;
+      if (el && el.clientWidth && el.clientHeight) {
+        tableMethods.recalculate();
+      }
+    }
     tableMethods = {
       dispatchEvent,
       /**
@@ -7126,6 +7072,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
         const rdLineEl = refDragRowLineElem.value;
         if (rdLineEl) {
           if (showLine) {
+            const scrollbarYToLeft = computeScrollbarYToLeft.value;
             const trRect = trEl.getBoundingClientRect();
             let trHeight = trEl.clientHeight;
             const offsetTop = Math.max(1, trRect.y - wrapperRect.y);
@@ -7133,6 +7080,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
               trHeight = tableHeight - offsetTop - scrollbarHeight;
             }
             rdLineEl.style.display = 'block';
+            rdLineEl.style.left = `${scrollbarYToLeft ? scrollbarWidth : 0}px`;
             rdLineEl.style.top = `${offsetTop}px`;
             rdLineEl.style.height = `${trHeight}px`;
             rdLineEl.style.width = `${tableWidth - scrollbarWidth}px`;
@@ -7146,6 +7094,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
         const cdLineEl = refDragColLineElem.value;
         if (cdLineEl) {
           if (showLine) {
+            const scrollbarXToTop = computeScrollbarXToTop.value;
             const leftContainerElem = refLeftContainer.value;
             const leftContainerWidth = leftContainerElem ? leftContainerElem.clientWidth : 0;
             const rightContainerElem = refRightContainer.value;
@@ -7170,7 +7119,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
             if (prevDragToChild) {
               cdLineEl.style.height = `${thRect.height}px`;
             } else {
-              cdLineEl.style.height = `${tableHeight - offsetTop - scrollbarHeight}px`;
+              cdLineEl.style.height = `${tableHeight - offsetTop - (scrollbarXToTop ? 0 : scrollbarHeight)}px`;
             }
             cdLineEl.setAttribute('drag-pos', dragPos);
             cdLineEl.setAttribute('drag-to-child', prevDragToChild ? 'y' : 'n');
@@ -9635,6 +9584,86 @@ var _default = exports.default = (0, _vue.defineComponent)({
           });
         }
       },
+      triggerVirtualScrollXEvent(evnt) {
+        const {
+          elemStore,
+          inWheelScroll,
+          lastScrollTop,
+          inHeaderScroll,
+          inBodyScroll,
+          inFooterScroll
+        } = internalData;
+        if (inHeaderScroll || inBodyScroll || inFooterScroll) {
+          return;
+        }
+        if (inWheelScroll) {
+          return;
+        }
+        const headerScrollElem = (0, _util.getRefElem)(elemStore['main-header-scroll']);
+        const bodyScrollElem = (0, _util.getRefElem)(elemStore['main-body-scroll']);
+        const footerScrollElem = (0, _util.getRefElem)(elemStore['main-footer-scroll']);
+        const yHandleEl = refScrollYHandleElem.value;
+        const wrapperEl = evnt.currentTarget;
+        const {
+          scrollLeft
+        } = wrapperEl;
+        const yBodyEl = yHandleEl || bodyScrollElem;
+        let scrollTop = 0;
+        if (yBodyEl) {
+          scrollTop = yBodyEl.scrollTop;
+        }
+        const isRollX = true;
+        const isRollY = scrollTop !== lastScrollTop;
+        internalData.inVirtualScroll = true;
+        (0, _dom.setScrollLeft)(bodyScrollElem, scrollLeft);
+        (0, _dom.setScrollLeft)(headerScrollElem, scrollLeft);
+        (0, _dom.setScrollLeft)(footerScrollElem, scrollLeft);
+        $xeTable.triggerScrollXEvent(evnt);
+        $xeTable.handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, {
+          type: 'table',
+          fixed: ''
+        });
+      },
+      triggerVirtualScrollYEvent(evnt) {
+        const {
+          elemStore,
+          inWheelScroll,
+          lastScrollLeft,
+          inHeaderScroll,
+          inBodyScroll,
+          inFooterScroll
+        } = internalData;
+        if (inHeaderScroll || inBodyScroll || inFooterScroll) {
+          return;
+        }
+        if (inWheelScroll) {
+          return;
+        }
+        const leftScrollElem = (0, _util.getRefElem)(elemStore['left-body-scroll']);
+        const bodyScrollElem = (0, _util.getRefElem)(elemStore['main-body-scroll']);
+        const rightScrollElem = (0, _util.getRefElem)(elemStore['right-body-scroll']);
+        const xHandleEl = refScrollXHandleElem.value;
+        const wrapperEl = evnt.currentTarget;
+        const {
+          scrollTop
+        } = wrapperEl;
+        const xBodyEl = xHandleEl || bodyScrollElem;
+        let scrollLeft = 0;
+        if (xBodyEl) {
+          scrollLeft = xBodyEl.scrollLeft;
+        }
+        const isRollX = scrollLeft !== lastScrollLeft;
+        const isRollY = true;
+        internalData.inVirtualScroll = true;
+        (0, _dom.setScrollTop)(bodyScrollElem, scrollTop);
+        (0, _dom.setScrollTop)(leftScrollElem, scrollTop);
+        (0, _dom.setScrollTop)(rightScrollElem, scrollTop);
+        $xeTable.triggerScrollYEvent(evnt);
+        $xeTable.handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, {
+          type: 'table',
+          fixed: ''
+        });
+      },
       /**
        * 对于树形结构中，可以直接滚动到指定深层节点中
        * 对于某些特定的场景可能会用到，比如定位到某一节点
@@ -10035,12 +10064,108 @@ var _default = exports.default = (0, _vue.defineComponent)({
       }
       return renderEmptyElement($xeTable);
     };
-    function handleUupdateResize() {
-      const el = refElem.value;
-      if (el && el.clientWidth && el.clientHeight) {
-        tableMethods.recalculate();
-      }
-    }
+    const renderScrollX = () => {
+      return (0, _vue.h)('div', {
+        key: 'vsx',
+        ref: refScrollXVirtualElem,
+        class: 'vxe-table--scroll-x-virtual'
+      }, [(0, _vue.h)('div', {
+        ref: refScrollXLeftCornerElem,
+        class: 'vxe-table--scroll-x-left-corner'
+      }), (0, _vue.h)('div', {
+        ref: refScrollXWrapperElem,
+        class: 'vxe-table--scroll-x-wrapper'
+      }, [(0, _vue.h)('div', {
+        ref: refScrollXHandleElem,
+        class: 'vxe-table--scroll-x-handle',
+        onScroll: $xeTable.triggerVirtualScrollXEvent
+      }, [(0, _vue.h)('div', {
+        ref: refScrollXSpaceElem,
+        class: 'vxe-table--scroll-x-space'
+      })])]), (0, _vue.h)('div', {
+        ref: refScrollXRightCornerElem,
+        class: 'vxe-table--scroll-x-right-corner'
+      })]);
+    };
+    const renderScrollY = () => {
+      return (0, _vue.h)('div', {
+        ref: refScrollYVirtualElem,
+        class: 'vxe-table--scroll-y-virtual'
+      }, [(0, _vue.h)('div', {
+        ref: refScrollYTopCornerElem,
+        class: 'vxe-table--scroll-y-top-corner'
+      }), (0, _vue.h)('div', {
+        ref: refScrollYWrapperElem,
+        class: 'vxe-table--scroll-y-wrapper'
+      }, [(0, _vue.h)('div', {
+        ref: refScrollYHandleElem,
+        class: 'vxe-table--scroll-y-handle',
+        onScroll: $xeTable.triggerVirtualScrollYEvent
+      }, [(0, _vue.h)('div', {
+        ref: refScrollYSpaceElem,
+        class: 'vxe-table--scroll-y-space'
+      })])]), (0, _vue.h)('div', {
+        ref: refScrollYBottomCornerElem,
+        class: 'vxe-table--scroll-y-bottom-corner'
+      })]);
+    };
+    const renderViewport = () => {
+      const {
+        showHeader,
+        showFooter
+      } = props;
+      const {
+        overflowX,
+        tableData,
+        tableColumn,
+        tableGroupColumn,
+        footerTableData,
+        columnStore
+      } = reactData;
+      const {
+        leftList,
+        rightList
+      } = columnStore;
+      return (0, _vue.h)('div', {
+        ref: refTableViewportElem,
+        class: 'vxe-table--viewport-wrapper'
+      }, [(0, _vue.h)('div', {
+        class: 'vxe-table--main-wrapper'
+      }, [
+      /**
+       * 表头
+       */
+      showHeader ? (0, _vue.h)(_header.default, {
+        ref: refTableHeader,
+        tableData,
+        tableColumn,
+        tableGroupColumn
+      }) : renderEmptyElement($xeTable),
+      /**
+       * 表体
+       */
+      (0, _vue.h)(_body.default, {
+        ref: refTableBody,
+        tableData,
+        tableColumn
+      }),
+      /**
+       * 表尾
+       */
+      showFooter ? (0, _vue.h)(_footer.default, {
+        ref: refTableFooter,
+        footerTableData,
+        tableColumn
+      }) : renderEmptyElement($xeTable)]), (0, _vue.h)('div', {
+        class: 'vxe-table--fixed-wrapper'
+      }, [leftList && leftList.length && overflowX ? renderFixed('left') : renderEmptyElement($xeTable), rightList && rightList.length && overflowX ? renderFixed('right') : renderEmptyElement($xeTable)])]);
+    };
+    const renderBody = () => {
+      const scrollbarYToLeft = computeScrollbarYToLeft.value;
+      return (0, _vue.h)('div', {
+        class: 'vxe-table--layout-wrapper'
+      }, scrollbarYToLeft ? [renderScrollY(), renderViewport()] : [renderViewport(), renderScrollY()]);
+    };
     const renderVN = () => {
       const {
         loading,
@@ -10063,11 +10188,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
         overflowY,
         scrollXLoad,
         scrollYLoad,
-        scrollbarHeight,
         tableData,
-        tableColumn,
-        tableGroupColumn,
-        footerTableData,
         initStore,
         columnStore,
         filterStore,
@@ -10095,9 +10216,11 @@ var _default = exports.default = (0, _vue.defineComponent)({
       const resizableOpts = computeResizableOpts.value;
       const isArea = mouseConfig && mouseOpts.area;
       const columnDragOpts = computeColumnDragOpts.value;
+      const scrollbarXToTop = computeScrollbarXToTop.value;
+      const scrollbarYToLeft = computeScrollbarYToLeft.value;
       return (0, _vue.h)('div', {
         ref: refElem,
-        class: ['vxe-table', 'vxe-table--render-default', `tid_${xID}`, `border--${tableBorder}`, {
+        class: ['vxe-table', 'vxe-table--render-default', `tid_${xID}`, `border--${tableBorder}`, `sx-pos--${scrollbarXToTop ? 'top' : 'bottom'}`, `sy-pos--${scrollbarYToLeft ? 'left' : 'right'}`, {
           [`size--${vSize}`]: vSize,
           [`valid-msg--${validOpts.msgMode}`]: !!editRules,
           'vxe-editable': !!editConfig,
@@ -10140,69 +10263,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
       }, slots.default ? slots.default({}) : []), (0, _vue.h)('div', {
         key: 'tw',
         class: 'vxe-table--render-wrapper'
-      }, [(0, _vue.h)('div', {
-        ref: refTableViewportElem,
-        class: 'vxe-table--viewport-wrapper'
-      }, [(0, _vue.h)('div', {
-        class: 'vxe-table--main-wrapper'
-      }, [
-      /**
-       * 表头
-       */
-      showHeader ? (0, _vue.h)(_header.default, {
-        ref: refTableHeader,
-        tableData,
-        tableColumn,
-        tableGroupColumn
-      }) : renderEmptyElement($xeTable),
-      /**
-       * 表体
-       */
-      (0, _vue.h)(_body.default, {
-        ref: refTableBody,
-        tableData,
-        tableColumn
-      }),
-      /**
-       * 表尾
-       */
-      showFooter ? (0, _vue.h)(_footer.default, {
-        ref: refTableFooter,
-        footerTableData,
-        tableColumn
-      }) : renderEmptyElement($xeTable)]), (0, _vue.h)('div', {
-        class: 'vxe-table--fixed-wrapper'
-      }, [leftList && leftList.length && overflowX ? renderFixed('left') : renderEmptyElement($xeTable), rightList && rightList.length && overflowX ? renderFixed('right') : renderEmptyElement($xeTable)])]), (0, _vue.h)('div', {
-        ref: refScrollYVirtualElem,
-        class: 'vxe-table--scroll-y-virtual'
-      }, [(0, _vue.h)('div', {
-        ref: refScrollYTopCornerElem,
-        class: 'vxe-table--scroll-y-top-corner'
-      }), (0, _vue.h)('div', {
-        ref: refScrollYHandleElem,
-        class: 'vxe-table--scroll-y-handle',
-        onScroll: scrollYEvent
-      }, [(0, _vue.h)('div', {
-        ref: refScrollYSpaceElem,
-        class: 'vxe-table--scroll-y-space'
-      })]), (0, _vue.h)('div', {
-        ref: refScrollYBottomCornerElem,
-        class: 'vxe-table--scroll-y-bottom-corner'
-      })])]), (0, _vue.h)('div', {
-        key: 'vx',
-        ref: refScrollXVirtualElem,
-        class: 'vxe-table--scroll-x-virtual'
-      }, [(0, _vue.h)('div', {
-        ref: refScrollXHandleElem,
-        class: 'vxe-table--scroll-x-handle',
-        onScroll: scrollXEvent
-      }, [(0, _vue.h)('div', {
-        ref: refScrollXSpaceElem,
-        class: 'vxe-table--scroll-x-space'
-      })]), (0, _vue.h)('div', {
-        ref: refScrollXRightCornerElem,
-        class: 'vxe-table--scroll-x-right-corner'
-      })]),
+      }, scrollbarXToTop ? [renderScrollX(), renderBody()] : [renderBody(), renderScrollX()]),
       /**
        * 空数据
        */
@@ -10226,10 +10287,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
       (0, _vue.h)('div', {
         key: 'cl',
         ref: refCellResizeBar,
-        class: 'vxe-table--resizable-bar',
-        style: overflowX ? {
-          'padding-bottom': `${scrollbarHeight}px`
-        } : null
+        class: 'vxe-table--resizable-bar'
       }, resizableOpts.showDragTip ? [(0, _vue.h)('div', {
         ref: refCellResizeTip,
         class: 'vxe-table--resizable-number-tip'
@@ -10401,16 +10459,37 @@ var _default = exports.default = (0, _vue.defineComponent)({
         tableMethods.refreshColumn();
       });
     });
+    const reScrollFlag = (0, _vue.ref)(0);
+    (0, _vue.watch)(computeSize, () => {
+      reScrollFlag.value++;
+    });
     (0, _vue.watch)(() => props.showHeader, () => {
-      (0, _vue.nextTick)(() => {
-        tableMethods.recalculate(true).then(() => tableMethods.refreshScroll());
-      });
+      reScrollFlag.value++;
     });
     (0, _vue.watch)(() => props.showFooter, () => {
+      reScrollFlag.value++;
+    });
+    (0, _vue.watch)(reScrollFlag, () => {
       (0, _vue.nextTick)(() => {
         tableMethods.recalculate(true).then(() => tableMethods.refreshScroll());
       });
     });
+    const reLayoutFlag = (0, _vue.ref)(0);
+    (0, _vue.watch)(() => props.height, () => {
+      reLayoutFlag.value++;
+    });
+    (0, _vue.watch)(() => props.maxHeight, () => {
+      reLayoutFlag.value++;
+    });
+    (0, _vue.watch)(computeScrollbarXToTop, () => {
+      reLayoutFlag.value++;
+    });
+    (0, _vue.watch)(computeScrollbarYToLeft, () => {
+      reLayoutFlag.value++;
+    });
+    (0, _vue.watch)(reLayoutFlag, () => {
+      (0, _vue.nextTick)(() => tableMethods.recalculate(true));
+    });
     const footFlag = (0, _vue.ref)(0);
     (0, _vue.watch)(() => props.footerData ? props.footerData.length : -1, () => {
       footFlag.value++;
@@ -10421,17 +10500,6 @@ var _default = exports.default = (0, _vue.defineComponent)({
     (0, _vue.watch)(footFlag, () => {
       tableMethods.updateFooter();
     });
-    (0, _vue.watch)(() => props.height, () => {
-      (0, _vue.nextTick)(() => tableMethods.recalculate(true));
-    });
-    (0, _vue.watch)(() => props.maxHeight, () => {
-      (0, _vue.nextTick)(() => tableMethods.recalculate(true));
-    });
-    (0, _vue.watch)(computeSize, () => {
-      (0, _vue.nextTick)(() => {
-        tableMethods.recalculate(true).then(() => tableMethods.refreshScroll());
-      });
-    });
     (0, _vue.watch)(() => props.syncResize, value => {
       if (value) {
         handleUupdateResize();