vxe-table 3.14.0 → 3.14.2

package/es/table/src/methods.js

@@ -1,5 +1,5 @@
 import XEUtils from 'xe-utils';
-import { browse, getTpImg, isPx, isScale, hasClass, addClass, removeClass, getEventTargetNode, getPaddingTopBottomSize, getOffsetPos, setScrollTop, setScrollLeft, toCssUnit } from '../../ui/src/dom';
+import { getTpImg, isPx, isScale, hasClass, addClass, removeClass, getEventTargetNode, getPaddingTopBottomSize, getOffsetPos, setScrollTop, setScrollLeft, toCssUnit } from '../../ui/src/dom';
 import { getLastZIndex, nextZIndex, hasChildrenList, getFuncText, isEnableConf, formatText, eqEmptyValue } from '../../ui/src/utils';
 import { VxeUI } from '../../ui';
 import Cell from './cell';
@@ -7,6 +7,7 @@ import { getRowUniqueId, clearTableAllStatus, getRowkey, getRowid, rowToVisible,
 import { getSlotVNs } from '../../ui/src/vn';
 import { warnLog, errLog } from '../../ui/src/log';
 const { getConfig, getI18n, renderer, formats, interceptor, createEvent } = VxeUI;
+const browseObj = XEUtils.browse();
 const supportMaxRow = 5e6;
 const customStorageKey = 'VXE_CUSTOM_STORE';
 const maxYHeight = 5e6;
@@ -304,12 +305,12 @@ const updateScrollYStatus = ($xeTable, fullData) => {
     const reactData = $xeTable;
     const internalData = $xeTable;
     const { treeConfig } = props;
-    const sYOpts = $xeTable.computeSYOpts;
+    const virtualYOpts = $xeTable.computeVirtualYOpts;
     const treeOpts = $xeTable.computeTreeOpts;
     const { transform } = treeOpts;
     const allList = fullData || internalData.tableFullData;
     // 如果gt为0，则总是启用
-    const scrollYLoad = (transform || !treeConfig) && !!sYOpts.enabled && sYOpts.gt > -1 && (sYOpts.gt === 0 || sYOpts.gt < allList.length);
+    const scrollYLoad = (transform || !treeConfig) && !!virtualYOpts.enabled && virtualYOpts.gt > -1 && (virtualYOpts.gt === 0 || virtualYOpts.gt < allList.length);
     reactData.scrollYLoad = scrollYLoad;
     return scrollYLoad;
 };
@@ -413,7 +414,7 @@ function updateStyle($xeTable) {
     const props = $xeTable;
     const reactData = $xeTable;
     const internalData = $xeTable;
-    const { border, showHeaderOverflow: allColumnHeaderOverflow, showFooterOverflow: allColumnFooterOverflow, mouseConfig, spanMethod, footerSpanMethod } = props;
+    const { showHeaderOverflow: allColumnHeaderOverflow, showFooterOverflow: allColumnFooterOverflow, mouseConfig, spanMethod, footerSpanMethod } = props;
     const { isGroup, currentRow, tableColumn, scrollXLoad, scrollYLoad, overflowX, scrollbarWidth, overflowY, scrollbarHeight, scrollXWidth, columnStore, editStore, isAllOverflow, expandColumn } = reactData;
     const { visibleColumn, tableHeight, headerHeight, footerHeight, elemStore, customHeight, customMinHeight, customMaxHeight } = internalData;
     const el = $xeTable.$refs.refElem;
@@ -566,32 +567,6 @@ function updateStyle($xeTable) {
                 if (tableElem) {
                     tableElem.style.width = tWidth ? `${tWidth}px` : '';
                 }
-                const listElem = getRefElem(elemStore[`${name}-${layout}-list`]);
-                if (isGroup && listElem) {
-                    XEUtils.arrayEach(listElem.querySelectorAll('.col--group'), (thElem) => {
-                        const colNode = $xeTable.getColumnNode(thElem);
-                        if (colNode) {
-                            const column = colNode.item;
-                            const { showHeaderOverflow } = column;
-                            const cellOverflow = XEUtils.isBoolean(showHeaderOverflow) ? showHeaderOverflow : allColumnHeaderOverflow;
-                            const showEllipsis = cellOverflow === 'ellipsis';
-                            const showTitle = cellOverflow === 'title';
-                            const showTooltip = cellOverflow === true || cellOverflow === 'tooltip';
-                            const hasEllipsis = showTitle || showTooltip || showEllipsis;
-                            let childWidth = 0;
-                            let countChild = 0;
-                            if (hasEllipsis) {
-                                XEUtils.eachTree(column.children, (item) => {
-                                    if (!item.children || !column.children.length) {
-                                        countChild++;
-                                    }
-                                    childWidth += item.renderWidth;
-                                }, { children: 'children' });
-                            }
-                            thElem.style.width = hasEllipsis ? `${childWidth - countChild - (border ? 2 : 0)}px` : '';
-                        }
-                    });
-                }
             }
             else if (layout === 'body') {
                 if (currScrollElem) {
@@ -640,7 +615,7 @@ function updateStyle($xeTable) {
                 if (tableElem) {
                     tableElem.style.width = tWidth ? `${tWidth}px` : '';
                     // 兼容性处理
-                    tableElem.style.paddingRight = osbWidth && fixedType && (browse['-moz'] || browse.safari) ? `${osbWidth}px` : '';
+                    tableElem.style.paddingRight = osbWidth && fixedType && (browseObj['-moz'] || browseObj.safari) ? `${osbWidth}px` : '';
                 }
                 const emptyBlockElem = getRefElem(elemStore[`${name}-${layout}-emptyBlock`]);
                 if (emptyBlockElem) {
@@ -720,6 +695,106 @@ function handleChangeCell($xeTable, evnt, params) {
             .catch((e) => e);
     });
 }
+function handleDefaultSort($xeTable) {
+    const props = $xeTable;
+    const { sortConfig } = props;
+    if (sortConfig) {
+        const sortOpts = $xeTable.computeSortOpts;
+        let { defaultSort } = sortOpts;
+        if (defaultSort) {
+            if (!XEUtils.isArray(defaultSort)) {
+                defaultSort = [defaultSort];
+            }
+            if (defaultSort.length) {
+                (sortConfig.multiple ? defaultSort : defaultSort.slice(0, 1)).forEach((item, index) => {
+                    const { field, order } = item;
+                    if (field && order) {
+                        const column = $xeTable.getColumnByField(field);
+                        if (column && column.sortable) {
+                            column.order = order;
+                            column.sortTime = Date.now() + index;
+                        }
+                    }
+                });
+                if (!sortOpts.remote) {
+                    $xeTable.handleTableData(true).then(updateStyle);
+                }
+            }
+        }
+    }
+}
+/**
+ * 处理默认勾选
+ */
+function handleDefaultSelectionChecked($xeTable) {
+    const props = $xeTable;
+    const internalData = $xeTable;
+    const { checkboxConfig } = props;
+    if (checkboxConfig) {
+        const { fullDataRowIdData } = internalData;
+        const checkboxOpts = $xeTable.computeCheckboxOpts;
+        const { checkAll, checkRowKeys } = checkboxOpts;
+        if (checkAll) {
+            handleCheckedAllCheckboxRow($xeTable, true, true);
+        }
+        else if (checkRowKeys) {
+            const defSelection = [];
+            checkRowKeys.forEach((rowid) => {
+                if (fullDataRowIdData[rowid]) {
+                    defSelection.push(fullDataRowIdData[rowid].row);
+                }
+            });
+            handleCheckedCheckboxRow($xeTable, defSelection, true, true);
+        }
+    }
+}
+/**
+ * 处理单选框默认勾选
+ */
+function handleDefaultRadioChecked($xeTable) {
+    const props = $xeTable;
+    const internalData = $xeTable;
+    const { radioConfig } = props;
+    if (radioConfig) {
+        const { fullDataRowIdData } = internalData;
+        const radioOpts = $xeTable.computeRadioOpts;
+        const { checkRowKey: rowid, reserve } = radioOpts;
+        if (rowid) {
+            if (fullDataRowIdData[rowid]) {
+                handleCheckedRadioRow(fullDataRowIdData[rowid].row, true);
+            }
+            if (reserve) {
+                const rowkey = getRowkey($xeTable);
+                internalData.radioReserveRow = { [rowkey]: rowid };
+            }
+        }
+    }
+}
+/**
+ * 处理默认展开行
+ */
+function handleDefaultRowExpand($xeTable) {
+    const props = $xeTable;
+    const internalData = $xeTable;
+    const { expandConfig } = props;
+    if (expandConfig) {
+        const { fullDataRowIdData } = internalData;
+        const expandOpts = $xeTable.computeExpandOpts;
+        const { expandAll, expandRowKeys } = expandOpts;
+        if (expandAll) {
+            $xeTable.setAllRowExpand(true);
+        }
+        else if (expandRowKeys) {
+            const defExpandeds = [];
+            expandRowKeys.forEach((rowid) => {
+                if (fullDataRowIdData[rowid]) {
+                    defExpandeds.push(fullDataRowIdData[rowid].row);
+                }
+            });
+            $xeTable.setRowExpand(defExpandeds, true);
+        }
+    }
+}
 function handleRadioReserveRow($xeTable, row) {
     const internalData = $xeTable;
     const radioOpts = $xeTable.computeRadioOpts;
@@ -1188,17 +1263,17 @@ function calculateMergerOffsetIndex(list, offsetItem, type) {
     }
 }
 function setMerges($xeTable, merges, mList, rowList) {
-    const props = $xeTable;
+    // const props = $xeTable
     const internalData = $xeTable;
     if (merges) {
-        const { treeConfig } = props;
+        // const { treeConfig } = props
         const { visibleColumn } = internalData;
         if (!XEUtils.isArray(merges)) {
             merges = [merges];
         }
-        if (treeConfig && merges.length) {
-            errLog('vxe.error.noTree', ['merge-cells | merge-footer-items']);
-        }
+        // if (treeConfig && merges.length) {
+        //   errLog('vxe.error.noTree', ['merge-cells | merge-footer-items'])
+        // }
         merges.forEach((item) => {
             let { row, col, rowspan, colspan } = item;
             if (rowList && XEUtils.isNumber(row)) {
@@ -1239,18 +1314,18 @@ function setMerges($xeTable, merges, mList, rowList) {
     }
 }
 function removeMerges($xeTable, merges, mList, rowList) {
-    const props = $xeTable;
+    // const props = $xeTable
     const internalData = $xeTable;
     const rest = [];
     if (merges) {
-        const { treeConfig } = props;
+        // const { treeConfig } = props
         const { visibleColumn } = internalData;
         if (!XEUtils.isArray(merges)) {
             merges = [merges];
         }
-        if (treeConfig && merges.length) {
-            errLog('vxe.error.noTree', ['merge-cells | merge-footer-items']);
-        }
+        // if (treeConfig && merges.length) {
+        //   errLog('vxe.error.noTree', ['merge-cells | merge-footer-items'])
+        // }
         merges.forEach((item) => {
             let { row, col } = item;
             if (rowList && XEUtils.isNumber(row)) {
@@ -1695,7 +1770,7 @@ function hideDropTip($xeTable) {
  * @param {Event} evnt 事件
  * @param {Row} row 行对象
  */
-function handleTooltip($xeTable, evnt, tdEl, overflowElem, params) {
+function handleTooltip($xeTable, evnt, tdEl, overflowElem, tipElem, params) {
     const reactData = $xeTable;
     const tipOverEl = overflowElem || tdEl;
     if (!tipOverEl) {
@@ -1709,7 +1784,8 @@ function handleTooltip($xeTable, evnt, tdEl, overflowElem, params) {
     const customContent = contentMethod ? contentMethod(params) : null;
     const useCustom = contentMethod && !XEUtils.eqNull(customContent);
     const content = useCustom ? customContent : XEUtils.toString(column.type === 'html' ? tipOverEl.innerText : tipOverEl.textContent).trim();
-    if (content && (showAll || useCustom || (tipOverEl.scrollWidth > tipOverEl.clientWidth))) {
+    const isOver = tipOverEl.scrollWidth > tipOverEl.clientWidth;
+    if (content && (showAll || useCustom || isOver)) {
         Object.assign(tooltipStore, {
             row,
             column,
@@ -1719,7 +1795,7 @@ function handleTooltip($xeTable, evnt, tdEl, overflowElem, params) {
         $xeTable.$nextTick(() => {
             const $tooltip = $xeTable.$refs.refTooltip;
             if ($tooltip && $tooltip.open) {
-                $tooltip.open(tipOverEl, formatText(content));
+                $tooltip.open(isOver ? tipOverEl : tipElem, formatText(content));
             }
         });
     }
@@ -1734,7 +1810,7 @@ function handleScrollToRowColumn($xeTable, fieldOrColumn, row) {
     }
     return $xeTable.$nextTick();
 }
-const handleRowExpandReserve = ($xeTable, row, expanded) => {
+function handleRowExpandReserve($xeTable, row, expanded) {
     const internalData = $xeTable;
     const { rowExpandedReserveRowMap } = internalData;
     const expandOpts = $xeTable.computeExpandOpts;
@@ -1747,7 +1823,21 @@ const handleRowExpandReserve = ($xeTable, row, expanded) => {
             delete rowExpandedReserveRowMap[rowid];
         }
     }
-};
+}
+function handleDefaultMergeCells($xeTable) {
+    const props = $xeTable;
+    const { mergeCells } = props;
+    if (mergeCells) {
+        $xeTable.setMergeCells(mergeCells);
+    }
+}
+function handleDefaultMergeFooterItems($xeTable) {
+    const props = $xeTable;
+    const { mergeFooterItems } = props;
+    if (mergeFooterItems) {
+        $xeTable.setMergeFooterItems(mergeFooterItems);
+    }
+}
 // 计算可视渲染相关数据
 function computeScrollLoad($xeTable) {
     const reactData = $xeTable;
@@ -1835,6 +1925,26 @@ function handleRecalculateLayout($xeTable, reFull) {
         }
     });
 }
+/**
+ * 处理数据加载默认行为
+ * 默认执行一次，除非被重置
+ */
+function handleLoadDefaults($xeTable) {
+    handleDefaultSelectionChecked($xeTable);
+    handleDefaultRadioChecked($xeTable);
+    handleDefaultRowExpand($xeTable);
+    handleDefaultTreeExpand($xeTable);
+    handleDefaultMergeCells($xeTable);
+    handleDefaultMergeFooterItems($xeTable);
+    $xeTable.$nextTick(() => setTimeout(() => $xeTable.recalculate()));
+}
+/**
+ * 处理初始化的默认行为
+ * 只会执行一次
+ */
+function handleInitDefaults($xeTable) {
+    handleDefaultSort($xeTable);
+}
 function handleTableColumn($xeTable) {
     const reactData = $xeTable;
     const internalData = $xeTable;
@@ -1900,7 +2010,7 @@ function parseColumns($xeTable, isReset) {
     const centerList = [];
     const rightList = [];
     const { isGroup, columnStore } = reactData;
-    const sXOpts = $xeTable.computeSXOpts;
+    const virtualXOpts = $xeTable.computeVirtualXOpts;
     const { collectColumn, tableFullColumn, scrollXStore, fullColumnIdData } = internalData;
     // 如果是分组表头，如果子列全部被隐藏，则根列也隐藏
     if (isGroup) {
@@ -1964,7 +2074,7 @@ function parseColumns($xeTable, isReset) {
     }
     const visibleColumn = leftList.concat(centerList).concat(rightList);
     // 如果gt为0，则总是启用
-    const scrollXLoad = !!sXOpts.enabled && sXOpts.gt > -1 && (sXOpts.gt === 0 || sXOpts.gt < tableFullColumn.length);
+    const scrollXLoad = !!virtualXOpts.enabled && virtualXOpts.gt > -1 && (virtualXOpts.gt === 0 || virtualXOpts.gt < tableFullColumn.length);
     reactData.hasFixedColumn = leftList.length > 0 || rightList.length > 0;
     Object.assign(columnStore, { leftList, centerList, rightList });
     if (scrollXLoad) {
@@ -2539,9 +2649,14 @@ const Methods = {
      */
     loadTableData(datas, isReset) {
         const $xeTable = this;
+        const props = $xeTable;
         const reactData = $xeTable;
         const internalData = $xeTable;
-        const { keepSource, treeConfig, treeOpts, editStore, scrollYStore, scrollXStore, lastScrollLeft, lastScrollTop, scrollYLoad: oldScrollYLoad, sXOpts, sYOpts } = this;
+        const { keepSource, treeConfig } = props;
+        const { scrollYLoad: oldScrollYLoad } = reactData;
+        const { scrollYStore, scrollXStore, lastScrollLeft, lastScrollTop } = internalData;
+        const treeOpts = $xeTable.computeTreeOpts;
+        const { transform } = treeOpts;
         const childrenField = treeOpts.children || treeOpts.childrenField;
         let treeData = [];
         let fullData = datas ? datas.slice(0) : [];
@@ -2550,7 +2665,7 @@ const Methods = {
         }
         if (treeConfig) {
             // 树结构自动转换
-            if (treeOpts.transform) {
+            if (transform) {
                 if (!treeOpts.rowField) {
                     errLog('vxe.error.reqProp', ['table.tree-config.rowField']);
                 }
@@ -2589,8 +2704,8 @@ const Methods = {
         scrollXStore.endIndex = 1;
         reactData.isRowLoading = true;
         reactData.scrollVMLoading = false;
-        editStore.insertMaps = {};
-        editStore.removeMaps = {};
+        internalData.insertRowMaps = {};
+        internalData.removeRowMaps = {};
         const sYLoad = updateScrollYStatus($xeTable, fullData);
         reactData.isDragColMove = false;
         reactData.isDragRowMove = false;
@@ -2608,15 +2723,15 @@ const Methods = {
         if (keepSource) {
             $xeTable.cacheSourceMap(fullData);
         }
-        if (this.clearCellAreas && this.mouseConfig) {
-            this.clearCellAreas();
-            this.clearCopyCellArea();
+        if ($xeTable.clearCellAreas && props.mouseConfig) {
+            $xeTable.clearCellAreas();
+            $xeTable.clearCopyCellArea();
         }
-        this.clearMergeCells();
-        this.clearMergeFooterItems();
-        this.handleTableData(true);
-        this.updateFooter();
-        return this.$nextTick().then(() => {
+        $xeTable.clearMergeCells();
+        $xeTable.clearMergeFooterItems();
+        $xeTable.handleTableData(true);
+        $xeTable.updateFooter();
+        return $xeTable.$nextTick().then(() => {
             updateHeight($xeTable);
             updateStyle($xeTable);
         }).then(() => {
@@ -2629,49 +2744,51 @@ const Methods = {
             if (sYLoad) {
                 // if (showOverflow) {
                 //   if (!rowOpts.height) {
-                //     const errColumn = this.tableFullColumn.find((column: any) => column.showOverflow === false)
+                //     const errColumn = internalData.tableFullColumn.find((column: any) => column.showOverflow === false)
                 //     if (errColumn) {
                 //       errLog('vxe.error.errProp', [`column[field="${errColumn.field}"].show-overflow=false`, 'show-overflow=true'])
                 //     }
                 //   }
                 // }
-                if (!(this.height || this.maxHeight)) {
+                if (!(props.height || props.maxHeight)) {
                     errLog('vxe.error.reqProp', ['table.height | table.max-height | table.scroll-y={enabled: false}']);
                 }
-                // if (!this.showOverflow) {
+                // if (!props.showOverflow) {
                 //   warnLog('vxe.error.reqProp', ['table.show-overflow'])
                 // }
-                if (this.spanMethod) {
+                if (props.spanMethod) {
                     errLog('vxe.error.scrollErrProp', ['table.span-method']);
                 }
             }
             handleReserveStatus($xeTable);
-            this.checkSelectionStatus();
+            $xeTable.checkSelectionStatus();
             return new Promise(resolve => {
                 this.$nextTick()
-                    .then(() => this.recalculate())
+                    .then(() => $xeTable.recalculate())
                     .then(() => {
                     let targetScrollLeft = lastScrollLeft;
                     let targetScrollTop = lastScrollTop;
+                    const virtualXOpts = $xeTable.computeVirtualXOpts;
+                    const virtualYOpts = $xeTable.computeVirtualYOpts;
                     // 是否在更新数据之后自动滚动重置滚动条
-                    if (sXOpts.scrollToLeftOnChange) {
+                    if (virtualXOpts.scrollToLeftOnChange) {
                         targetScrollLeft = 0;
                     }
-                    if (sYOpts.scrollToTopOnChange) {
+                    if (virtualYOpts.scrollToTopOnChange) {
                         targetScrollTop = 0;
                     }
                     reactData.isRowLoading = false;
                     calcCellHeight($xeTable);
                     // 是否变更虚拟滚动
                     if (oldScrollYLoad === sYLoad) {
-                        restoreScrollLocation(this, targetScrollLeft, targetScrollTop)
+                        restoreScrollLocation($xeTable, targetScrollLeft, targetScrollTop)
                             .then(() => {
                             resolve();
                         });
                     }
                     else {
                         setTimeout(() => {
-                            restoreScrollLocation(this, targetScrollLeft, targetScrollTop)
+                            restoreScrollLocation($xeTable, targetScrollLeft, targetScrollTop)
                                 .then(() => {
                                 resolve();
                             });
@@ -2686,12 +2803,13 @@ const Methods = {
      * @param {Array} datas 数据
      */
     loadData(datas) {
+        const $xeTable = this;
         const { initStatus } = this;
         return this.loadTableData(datas, false).then(() => {
             this.inited = true;
             this.initStatus = true;
             if (!initStatus) {
-                this.handleLoadDefaults();
+                handleLoadDefaults($xeTable);
             }
             return this.recalculate();
         });
@@ -2701,6 +2819,7 @@ const Methods = {
      * @param {Array} datas 数据
      */
     reloadData(datas) {
+        const $xeTable = this;
         return this.clearAll()
             .then(() => {
             this.inited = true;
@@ -2708,7 +2827,7 @@ const Methods = {
             return this.loadTableData(datas, true);
         })
             .then(() => {
-            this.handleLoadDefaults();
+            handleLoadDefaults($xeTable);
             return this.recalculate();
         });
     },
@@ -2864,11 +2983,17 @@ const Methods = {
         internalData.tableSourceData = sourceData;
     },
     getParams() {
-        return this.params;
+        const $xeTable = this;
+        const props = $xeTable;
+        return props.params;
     },
     loadTreeChildren(row, childRecords) {
         const $xeTable = this;
-        const { keepSource, tableSourceData, treeOpts, fullDataRowIdData, fullAllDataRowIdData, sourceDataRowIdData } = this;
+        const props = $xeTable;
+        const internalData = $xeTable;
+        const { keepSource } = props;
+        const { tableSourceData, fullDataRowIdData, fullAllDataRowIdData, sourceDataRowIdData } = internalData;
+        const treeOpts = $xeTable.computeTreeOpts;
         const { transform, mapChildrenField } = treeOpts;
         const childrenField = treeOpts.children || treeOpts.childrenField;
         const parentRest = fullAllDataRowIdData[getRowid($xeTable, row)];
@@ -2905,18 +3030,22 @@ const Methods = {
      * @param {Element} tr 元素
      */
     getRowNode(tr) {
+        const $xeTable = this;
+        const internalData = $xeTable;
         if (tr) {
-            const { fullAllDataRowIdData } = this;
+            const { fullAllDataRowIdData } = internalData;
             const rowid = tr.getAttribute('rowid');
-            const rowRest = fullAllDataRowIdData[rowid];
-            if (rowRest) {
-                return {
-                    rowid: rowRest.rowid,
-                    item: rowRest.row,
-                    index: rowRest.index,
-                    items: rowRest.items,
-                    parent: rowRest.parent
-                };
+            if (rowid) {
+                const rowRest = fullAllDataRowIdData[rowid];
+                if (rowRest) {
+                    return {
+                        rowid: rowRest.rowid,
+                        item: rowRest.row,
+                        index: rowRest.index,
+                        items: rowRest.items,
+                        parent: rowRest.parent
+                    };
+                }
             }
         }
         return null;
@@ -2926,8 +3055,10 @@ const Methods = {
      * @param {Element} cell 元素
      */
     getColumnNode(cell) {
+        const $xeTable = this;
+        const internalData = $xeTable;
         if (cell) {
-            const { fullColumnIdData } = this;
+            const { fullColumnIdData } = internalData;
             const colid = cell.getAttribute('colid');
             if (colid) {
                 const colRest = fullColumnIdData[colid];
@@ -3019,14 +3150,21 @@ const Methods = {
      * @param {Row} records 行数据
      */
     defineField(records) {
-        const { radioOpts, checkboxOpts, treeConfig, treeOpts, expandOpts } = this;
+        const $xeTable = this;
+        const props = $xeTable;
+        const internalData = $xeTable;
+        const { treeConfig } = props;
+        const expandOpts = $xeTable.computeExpandOpts;
+        const treeOpts = $xeTable.computeTreeOpts;
+        const radioOpts = $xeTable.computeRadioOpts;
+        const checkboxOpts = $xeTable.computeCheckboxOpts;
         const childrenField = treeOpts.children || treeOpts.childrenField;
-        const rowkey = getRowkey(this);
+        const rowkey = getRowkey($xeTable);
         if (!XEUtils.isArray(records)) {
             records = [records || {}];
         }
         return records.map((record) => {
-            this.tableFullColumn.forEach((column) => {
+            internalData.tableFullColumn.forEach(column => {
                 const { field, editRender } = column;
                 if (field && !XEUtils.has(record, field)) {
                     let cellValue = null;
@@ -3064,8 +3202,9 @@ const Methods = {
      * @param {Array} records 新数据
      */
     createData(records) {
-        return this.$nextTick().then(() => {
-            return this.defineField(records);
+        const $xeTable = this;
+        return $xeTable.$nextTick().then(() => {
+            return $xeTable.defineField(records);
         });
     },
     /**
@@ -3074,11 +3213,12 @@ const Methods = {
      * @param {Array/Object} records 新数据
      */
     createRow(records) {
+        const $xeTable = this;
         const isArr = XEUtils.isArray(records);
         if (!isArr) {
             records = [records];
         }
-        return this.createData(records).then((rows) => isArr ? rows : rows[0]);
+        return $xeTable.createData(records).then((rows) => isArr ? rows : rows[0]);
     },
     /**
      * 还原数据
@@ -3093,9 +3233,7 @@ const Methods = {
         const reactData = $xeTable;
         const internalData = $xeTable;
         const { keepSource, treeConfig } = props;
-        const { editStore } = reactData;
-        const { fullAllDataRowIdData, fullDataRowIdData, tableSourceData, sourceDataRowIdData, tableFullData, afterFullData } = internalData;
-        const removeTempMaps = Object.assign({}, editStore.removeMaps);
+        const { fullAllDataRowIdData, fullDataRowIdData, tableSourceData, sourceDataRowIdData, tableFullData, afterFullData, removeRowMaps } = internalData;
         const treeOpts = $xeTable.computeTreeOpts;
         const { transform } = treeOpts;
         const { handleGetRowId } = createHandleGetRowId($xeTable);
@@ -3131,7 +3269,9 @@ const Methods = {
                                 XEUtils.destructuring(row, XEUtils.clone(oRow, true));
                             }
                             if (!fullDataRowIdData[rowid] && $xeTable.isRemoveByRow(row)) {
-                                delete removeTempMaps[rowid];
+                                if (removeRowMaps[rowid]) {
+                                    delete removeRowMaps[rowid];
+                                }
                                 tableFullData.unshift(row);
                                 afterFullData.unshift(row);
                                 reDelFlag = true;
@@ -3143,7 +3283,7 @@ const Methods = {
         }
         if (rows) {
             if (reDelFlag) {
-                editStore.removeMaps = removeTempMaps;
+                reactData.removeRowFlag++;
                 $xeTable.updateFooter();
                 $xeTable.cacheRowMap(false);
                 $xeTable.handleTableData(treeConfig && transform);
@@ -3172,7 +3312,9 @@ const Methods = {
      * @param {String} field 字段名
      */
     clearData(rows, field) {
-        const { tableFullData, visibleColumn } = this;
+        const $xeTable = this;
+        const internalData = $xeTable;
+        const { tableFullData, visibleColumn } = internalData;
         if (!arguments.length) {
             rows = tableFullData;
         }
@@ -3191,7 +3333,7 @@ const Methods = {
                 });
             });
         }
-        return this.$nextTick();
+        return $xeTable.$nextTick();
     },
     getCellElement(row, fieldOrColumn) {
         const $xeTable = this;
@@ -3282,16 +3424,16 @@ const Methods = {
     isInsertByRow(row) {
         const $xeTable = this;
         const reactData = $xeTable;
-        const { editStore } = reactData;
+        const internalData = $xeTable;
         const rowid = getRowid($xeTable, row);
-        return !!editStore.insertMaps[rowid];
+        return !!reactData.insertRowFlag && !!internalData.insertRowMaps[rowid];
     },
     isRemoveByRow(row) {
         const $xeTable = this;
         const reactData = $xeTable;
-        const { editStore } = reactData;
+        const internalData = $xeTable;
         const rowid = getRowid($xeTable, row);
-        return !!editStore.removeMaps[rowid];
+        return !!reactData.removeRowFlag && !!internalData.removeRowMaps[rowid];
     },
     /**
      * 删除所有新增的临时数据
@@ -3299,9 +3441,8 @@ const Methods = {
      */
     removeInsertRow() {
         const $xeTable = this;
-        const reactData = $xeTable;
-        const { editStore } = reactData;
-        editStore.insertMaps = {};
+        const internalData = $xeTable;
+        internalData.insertRowMaps = {};
         return $xeTable.remove($xeTable.getInsertRecords());
     },
     /**
@@ -3343,14 +3484,17 @@ const Methods = {
      * @param {Number} columnIndex 索引
      */
     getColumns(columnIndex) {
-        const columns = this.visibleColumn;
-        return XEUtils.isUndefined(columnIndex) ? columns.slice(0) : columns[columnIndex];
+        const $xeTable = this;
+        const internalData = $xeTable;
+        const { visibleColumn } = internalData;
+        return XEUtils.isUndefined(columnIndex) ? visibleColumn.slice(0) : visibleColumn[columnIndex];
     },
     /**
      * 根据列获取列的唯一主键
      */
     getColid(fieldOrColumn) {
-        const column = handleFieldOrColumn(this, fieldOrColumn);
+        const $xeTable = this;
+        const column = handleFieldOrColumn($xeTable, fieldOrColumn);
         return column ? column.id : null;
     },
     /**
@@ -3358,7 +3502,9 @@ const Methods = {
      * @param {String} colid 列主键
      */
     getColumnById(colid) {
-        const fullColumnIdData = this.fullColumnIdData;
+        const $xeTable = this;
+        const internalData = $xeTable;
+        const { fullColumnIdData } = internalData;
         return fullColumnIdData[colid] ? fullColumnIdData[colid].column : null;
     },
     /**
@@ -3366,7 +3512,9 @@ const Methods = {
      * @param {String} field 字段名
      */
     getColumnByField(field) {
-        const fullColumnFieldData = this.fullColumnFieldData;
+        const $xeTable = this;
+        const internalData = $xeTable;
+        const { fullColumnFieldData } = internalData;
         return fullColumnFieldData[field] ? fullColumnFieldData[field].column : null;
     },
     getParentColumn(fieldOrColumn) {
@@ -3379,11 +3527,14 @@ const Methods = {
      * 收集到的全量列、全量表头列、处理条件之后的全量表头列、当前渲染中的表头列
      */
     getTableColumn() {
+        const $xeTable = this;
+        const reactData = $xeTable;
+        const internalData = $xeTable;
         return {
-            collectColumn: this.collectColumn.slice(0),
-            fullColumn: this.tableFullColumn.slice(0),
-            visibleColumn: this.visibleColumn.slice(0),
-            tableColumn: this.tableColumn.slice(0)
+            collectColumn: internalData.collectColumn.slice(0),
+            fullColumn: internalData.tableFullColumn.slice(0),
+            visibleColumn: internalData.visibleColumn.slice(0),
+            tableColumn: reactData.tableColumn.slice(0)
         };
     },
     /**
@@ -3796,9 +3947,14 @@ const Methods = {
      * 如果存在排序，继续处理
      */
     getTableData() {
-        const { treeConfig, tableFullData, afterFullData, tableData, footerTableData, tableFullTreeData } = this;
+        const $xeTable = this;
+        const props = $xeTable;
+        const reactData = $xeTable;
+        const internalData = $xeTable;
+        const { tableData, footerTableData } = reactData;
+        const { tableFullData, afterFullData, tableFullTreeData } = internalData;
         return {
-            fullData: treeConfig ? tableFullTreeData.slice(0) : tableFullData.slice(0),
+            fullData: props.treeConfig ? tableFullTreeData.slice(0) : tableFullData.slice(0),
             visibleData: afterFullData.slice(0),
             tableData: tableData.slice(0),
             footerData: footerTableData.slice(0)
@@ -3837,35 +3993,15 @@ const Methods = {
      */
     handleLoadDefaults() {
         const $xeTable = this;
-        if (this.checkboxConfig) {
-            this.handleDefaultSelectionChecked();
-        }
-        if (this.radioConfig) {
-            this.handleDefaultRadioChecked();
-        }
-        if (this.expandConfig) {
-            this.handleDefaultRowExpand();
-        }
-        if (this.treeConfig) {
-            handleDefaultTreeExpand($xeTable);
-        }
-        if (this.mergeCells) {
-            this.handleDefaultMergeCells();
-        }
-        if (this.mergeFooterItems) {
-            this.handleDefaultMergeFooterItems();
-        }
-        this.$nextTick(() => setTimeout(this.recalculate));
+        handleLoadDefaults($xeTable);
     },
     /**
      * 处理初始化的默认行为
      * 只会执行一次
      */
     handleInitDefaults() {
-        const { sortConfig } = this;
-        if (sortConfig) {
-            this.handleDefaultSort();
-        }
+        const $xeTable = this;
+        handleInitDefaults($xeTable);
     },
     /**
      * 设置为固定列
@@ -4021,64 +4157,30 @@ const Methods = {
         return this.resetCustom(options);
     },
     handleCustom() {
-        const { mouseConfig } = this;
+        const $xeTable = this;
+        const props = $xeTable;
+        const { mouseConfig } = props;
         if (mouseConfig) {
-            if (this.clearSelected) {
-                this.clearSelected();
+            if ($xeTable.clearSelected) {
+                $xeTable.clearSelected();
             }
-            if (this.clearCellAreas) {
-                this.clearCellAreas();
-                this.clearCopyCellArea();
+            if ($xeTable.clearCellAreas) {
+                $xeTable.clearCellAreas();
+                $xeTable.clearCopyCellArea();
             }
         }
-        this.analyColumnWidth();
-        return this.refreshColumn(true);
-    },
-    handleCustomRestore(storeData) {
-        const $xeTable = this;
-        const reactData = $xeTable;
-        const internalData = $xeTable;
-        let { collectColumn } = internalData;
-        const { resizableData, sortData, visibleData, fixedData } = storeData;
-        let hasCustomSort = false;
-        // 处理还原
-        if (resizableData || sortData || visibleData || fixedData) {
-            XEUtils.eachTree(collectColumn, (column, index, items, path, parentRow) => {
-                const colKey = column.getKey();
-                // 支持一级
-                if (!parentRow) {
-                    if (fixedData && fixedData[colKey] !== undefined) {
-                        column.fixed = fixedData[colKey];
-                    }
-                    if (sortData && XEUtils.isNumber(sortData[colKey])) {
-                        hasCustomSort = true;
-                        column.renderSortNumber = sortData[colKey];
-                    }
-                }
-                if (resizableData && XEUtils.isNumber(resizableData[colKey])) {
-                    column.resizeWidth = resizableData[colKey];
-                }
-                if (visibleData && XEUtils.isBoolean(visibleData[colKey])) {
-                    column.visible = visibleData[colKey];
-                }
-            });
-            // 如果自定义了顺序
-            if (hasCustomSort) {
-                collectColumn = XEUtils.orderBy(collectColumn, 'renderSortNumber');
-                internalData.collectColumn = collectColumn;
-                internalData.tableFullColumn = getColumnList(collectColumn);
-            }
-            reactData.isCustomStatus = true;
-        }
-        else {
-            reactData.isCustomStatus = false;
-        }
+        $xeTable.analyColumnWidth();
+        return $xeTable.refreshColumn(true);
     },
     /**
      * 还原自定义列操作状态
      */
     restoreCustomStorage() {
-        const { tableId, customConfig, customOpts } = this;
+        const $xeTable = this;
+        const props = $xeTable;
+        const { customConfig } = props;
+        const tableId = $xeTable.computeTableId;
+        const customOpts = $xeTable.computeCustomOpts;
         const { storage, restoreStore } = customOpts;
         const isAllCustom = storage === true;
         const storageOpts = isAllCustom ? {} : Object.assign({}, storage || {});
@@ -4097,11 +4199,11 @@ const Methods = {
                     if (!storeData) {
                         return;
                     }
-                    return this.handleCustomRestore(storeData);
+                    return handleCustomRestore($xeTable, storeData);
                 }).catch(e => e);
             }
             else {
-                return this.handleCustomRestore(storeData);
+                return handleCustomRestore($xeTable, storeData);
             }
         }
     },
@@ -5440,7 +5542,7 @@ const Methods = {
             return;
         }
         if (tooltipStore.column !== column || !tooltipStore.visible) {
-            handleTooltip($xeTable, evnt, thEl, thEl.querySelector('.vxe-cell--title') || cellEl, params);
+            handleTooltip($xeTable, evnt, thEl, thEl.querySelector('.vxe-cell--wrapper'), thEl.querySelector('.vxe-cell--title') || cellEl, params);
         }
     },
     /**
@@ -5470,7 +5572,7 @@ const Methods = {
             }
         }
         if (tooltipStore.column !== column || tooltipStore.row !== row || !tooltipStore.visible) {
-            handleTooltip($xeTable, evnt, tdEl, tdEl.querySelector('.vxe-cell--label') || tdEl.querySelector('.vxe-cell--wrapper'), params);
+            handleTooltip($xeTable, evnt, tdEl, tdEl.querySelector('.vxe-cell--wrapper'), tdEl.querySelector('.vxe-cell--label') || tdEl.querySelector('.vxe-cell--wrapper'), params);
         }
     },
     /**
@@ -5484,7 +5586,7 @@ const Methods = {
         const tdEl = evnt.currentTarget;
         handleTargetEnterEvent($xeTable, tooltipStore.column !== column || !!tooltipStore.row);
         if (tooltipStore.column !== column || !tooltipStore.visible) {
-            handleTooltip($xeTable, evnt, tdEl, tdEl.querySelector('.vxe-cell--label') || tdEl.querySelector('.vxe-cell--wrapper'), params);
+            handleTooltip($xeTable, evnt, tdEl, tdEl.querySelector('.vxe-cell--wrapper'), tdEl.querySelector('.vxe-cell--label') || tdEl.querySelector('.vxe-cell--wrapper'), params);
         }
     },
     openTooltip(target, content) {
@@ -5564,26 +5666,6 @@ const Methods = {
         }
         return [];
     },
-    /**
-     * 处理默认勾选
-     */
-    handleDefaultSelectionChecked() {
-        const $xeTable = this;
-        const { fullDataRowIdData, checkboxOpts } = this;
-        const { checkAll, checkRowKeys } = checkboxOpts;
-        if (checkAll) {
-            handleCheckedAllCheckboxRow($xeTable, true, true);
-        }
-        else if (checkRowKeys) {
-            const defSelection = [];
-            checkRowKeys.forEach((rowid) => {
-                if (fullDataRowIdData[rowid]) {
-                    defSelection.push(fullDataRowIdData[rowid].row);
-                }
-            });
-            handleCheckedCheckboxRow($xeTable, defSelection, true, true);
-        }
-    },
     handleCheckedCheckboxRow(rows, value, isForce) {
         const $xeTable = this;
         return handleCheckedCheckboxRow($xeTable, rows, value, isForce);
@@ -6167,23 +6249,6 @@ const Methods = {
         reactData.updateCheckboxFlag++;
         return this.$nextTick();
     },
-    /**
-     * 处理单选框默认勾选
-     */
-    handleDefaultRadioChecked() {
-        const $xeTable = this;
-        const { radioOpts, fullDataRowIdData } = this;
-        const { checkRowKey: rowid, reserve } = radioOpts;
-        if (rowid) {
-            if (fullDataRowIdData[rowid]) {
-                handleCheckedRadioRow($xeTable, fullDataRowIdData[rowid].row, true);
-            }
-            if (reserve) {
-                const rowkey = getRowkey(this);
-                this.radioReserveRow = { [rowkey]: rowid };
-            }
-        }
-    },
     /**
      * 单选，行选中事件
      */
@@ -6564,31 +6629,6 @@ const Methods = {
         }
         this.emitEvent('cell-dblclick', params, evnt);
     },
-    handleDefaultSort() {
-        const $xeTable = this;
-        const { sortConfig, sortOpts } = this;
-        let { defaultSort } = sortOpts;
-        if (defaultSort) {
-            if (!XEUtils.isArray(defaultSort)) {
-                defaultSort = [defaultSort];
-            }
-            if (defaultSort.length) {
-                (sortConfig.multiple ? defaultSort : defaultSort.slice(0, 1)).forEach((item, index) => {
-                    const { field, order } = item;
-                    if (field && order) {
-                        const column = this.getColumnByField(field);
-                        if (column && column.sortable) {
-                            column.order = order;
-                            column.sortTime = Date.now() + index;
-                        }
-                    }
-                });
-                if (!sortOpts.remote) {
-                    this.handleTableData(true).then(() => updateStyle($xeTable));
-                }
-            }
-        }
-    },
     handleColumnSortEvent(evnt, column) {
         const $xeTable = this;
         const props = $xeTable;
@@ -7704,25 +7744,6 @@ const Methods = {
     toggleRowExpand(row) {
         return this.setRowExpand(row, !this.isRowExpandByRow(row));
     },
-    /**
-     * 处理默认展开行
-     */
-    handleDefaultRowExpand() {
-        const { expandOpts, fullDataRowIdData } = this;
-        const { expandAll, expandRowKeys } = expandOpts;
-        if (expandAll) {
-            this.setAllRowExpand(true);
-        }
-        else if (expandRowKeys) {
-            const defExpandeds = [];
-            expandRowKeys.forEach((rowid) => {
-                if (fullDataRowIdData[rowid]) {
-                    defExpandeds.push(fullDataRowIdData[rowid].row);
-                }
-            });
-            this.setRowExpand(defExpandeds, true);
-        }
-    },
     /**
      * 设置所有行的展开与否
      * @param {Boolean} expanded 是否展开
@@ -8299,8 +8320,8 @@ const Methods = {
      */
     triggerScrollXEvent() {
         const $xeTable = this;
-        const sXOpts = $xeTable.computeSXOpts;
-        if (sXOpts.immediate) {
+        const virtualXOpts = $xeTable.computeVirtualXOpts;
+        if (virtualXOpts.immediate) {
             loadScrollXData($xeTable);
         }
         else {
@@ -8312,8 +8333,8 @@ const Methods = {
      */
     triggerScrollYEvent() {
         const $xeTable = this;
-        const sYOpts = $xeTable.computeSYOpts;
-        if (sYOpts.immediate) {
+        const virtualYOpts = $xeTable.computeVirtualYOpts;
+        if (virtualYOpts.immediate) {
             loadScrollYData($xeTable);
         }
         else {
@@ -8522,8 +8543,8 @@ const Methods = {
             return;
         }
         const wheelSpeed = getWheelSpeed(reactData.lastScrollTime);
-        const deltaTop = Math.ceil((shiftKey ? deltaX : deltaY) * wheelSpeed);
-        const deltaLeft = Math.ceil((shiftKey ? deltaY : deltaX) * wheelSpeed);
+        const deltaTop = shiftKey ? 0 : Math.ceil(deltaY * wheelSpeed);
+        const deltaLeft = Math.ceil((shiftKey ? (deltaY || deltaX) : deltaX) * wheelSpeed);
         const isTopWheel = deltaTop < 0;
         const currScrollTop = bodyScrollElem.scrollTop;
         // 如果滚动位置已经是顶部或底部，则不需要触发
@@ -9023,9 +9044,6 @@ const Methods = {
             }
         });
     },
-    handleDefaultMergeCells() {
-        this.setMergeCells(this.mergeCells);
-    },
     /**
      * 设置合并单元格
      * @param {TableMergeConfig[]} merges { row: Row|number, column: ColumnInfo|number, rowspan: number, colspan: number }
@@ -9073,9 +9091,6 @@ const Methods = {
             return updateStyle($xeTable);
         });
     },
-    handleDefaultMergeFooterItems() {
-        this.setMergeFooterItems(this.mergeFooterItems);
-    },
     setMergeFooterItems(merges) {
         const $xeTable = this;
         if (this.footerSpanMethod) {