vxe-table 3.15.5 → 3.15.7

package/es/table/src/methods.js

@@ -1,5 +1,5 @@
 import XEUtils from 'xe-utils';
-import { 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, hasControlKey } from '../../ui/src/dom';
 import { getLastZIndex, nextZIndex, hasChildrenList, getFuncText, isEnableConf, formatText, eqEmptyValue } from '../../ui/src/utils';
 import { VxeUI } from '../../ui';
 import Cell from './cell';
@@ -170,7 +170,7 @@ function restoreCustomStorage($xeTable) {
         }
         const storeData = getCustomStorageMap(tableId);
         if (restoreStore) {
-            return Promise.resolve(restoreStore({ id: tableId, type: 'restore', storeData })).then(storeData => {
+            return Promise.resolve(restoreStore({ $table: $xeTable, id: tableId, type: 'restore', storeData })).then(storeData => {
                 if (!storeData) {
                     return;
                 }
@@ -203,6 +203,7 @@ function cacheColumnMap($xeTable) {
     const rowOpts = $xeTable.computeRowOpts;
     const isGroup = collectColumn.some(hasChildrenList);
     let isAllOverflow = !!props.showOverflow;
+    let rowGroupColumn;
     let expandColumn;
     let treeNodeColumn;
     let checkboxColumn;
@@ -210,7 +211,7 @@ function cacheColumnMap($xeTable) {
     let htmlColumn;
     let hasFixed;
     const handleFunc = (column, index, items, path, parentColumn) => {
-        const { id: colid, field, fixed, type, treeNode } = column;
+        const { id: colid, field, fixed, type, treeNode, rowGroupNode } = column;
         const rest = { $index: -1, _index: -1, column, colid, index, items, parent: parentColumn || null, width: 0, oLeft: 0 };
         if (field) {
             if (fullColumnFieldData[field]) {
@@ -237,7 +238,15 @@ function cacheColumnMap($xeTable) {
                 treeNodeColumn = column;
             }
         }
-        else if (type === 'expand') {
+        if (rowGroupNode) {
+            if (treeNodeColumn) {
+                warnLog('vxe.error.colRepet', ['row-group-node', rowGroupNode]);
+            }
+            if (!rowGroupColumn) {
+                rowGroupColumn = column;
+            }
+        }
+        if (type === 'expand') {
             if (expandColumn) {
                 warnLog('vxe.error.colRepet', ['type', type]);
             }
@@ -290,6 +299,7 @@ function cacheColumnMap($xeTable) {
         }
     }
     reactData.isGroup = isGroup;
+    reactData.rowGroupColumn = rowGroupColumn;
     reactData.treeNodeColumn = treeNodeColumn;
     reactData.expandColumn = expandColumn;
     reactData.isAllOverflow = isAllOverflow;
@@ -318,7 +328,7 @@ function handleBaseTreeExpand($xeTable, rows, expanded) {
     const reactData = $xeTable;
     const internalData = $xeTable;
     const { treeNodeColumn } = reactData;
-    const { fullAllDataRowIdData, tableFullData, treeExpandedMaps, treeExpandLazyLoadedMaps } = internalData;
+    const { fullAllDataRowIdData, tableFullTreeData, treeExpandedMaps, treeExpandLazyLoadedMaps } = internalData;
     const treeOpts = $xeTable.computeTreeOpts;
     const { reserve, lazy, accordion, toggleMethod } = treeOpts;
     const childrenField = treeOpts.children || treeOpts.childrenField;
@@ -331,7 +341,7 @@ function handleBaseTreeExpand($xeTable, rows, expanded) {
     if (accordion) {
         validRows = validRows.length ? [validRows[validRows.length - 1]] : [];
         // 同一级只能展开一个
-        const matchObj = XEUtils.findTree(tableFullData, item => item === validRows[0], { children: childrenField });
+        const matchObj = XEUtils.findTree(tableFullTreeData, item => item === validRows[0], { children: childrenField });
         if (matchObj) {
             matchObj.items.forEach(item => {
                 const rowid = handleGetRowId(item);
@@ -384,9 +394,86 @@ function handleBaseTreeExpand($xeTable, rows, expanded) {
  * @returns
  */
 function handleVirtualTreeExpand($xeTable, rows, expanded) {
+    const reactData = $xeTable;
     return handleBaseTreeExpand($xeTable, rows, expanded).then(() => {
         handleVirtualTreeToList($xeTable);
         $xeTable.handleTableData();
+        reactData.treeExpandedFlag++;
+        updateAfterDataIndex($xeTable);
+        return $xeTable.$nextTick();
+    }).then(() => {
+        return $xeTable.recalculate(true);
+    }).then(() => {
+        setTimeout(() => {
+            $xeTable.updateCellAreas();
+        }, 30);
+    });
+}
+/**
+ * 展开与收起行分组节点
+ * @param rows
+ * @param expanded
+ * @returns
+ */
+function handleRowGroupBaseExpand($xeTable, rows, expanded) {
+    const reactData = $xeTable;
+    const internalData = $xeTable;
+    const { fullAllDataRowIdData, tableFullGroupData, rowGroupExpandedMaps } = internalData;
+    const rowGroupOpts = $xeTable.computeRowGroupOpts;
+    const { mapChildrenField, accordion } = rowGroupOpts;
+    const { handleGetRowId } = createHandleGetRowId($xeTable);
+    let validRows = rows;
+    if (mapChildrenField) {
+        if (accordion) {
+            validRows = validRows.length ? [validRows[validRows.length - 1]] : [];
+            // 同一级只能展开一个
+            const matchObj = XEUtils.findTree(tableFullGroupData, item => getRowid($xeTable, item) === getRowid($xeTable, validRows[0]), { children: mapChildrenField });
+            if (matchObj) {
+                matchObj.items.forEach(item => {
+                    const rowid = handleGetRowId(item);
+                    if (rowGroupExpandedMaps[rowid]) {
+                        delete rowGroupExpandedMaps[rowid];
+                    }
+                });
+            }
+        }
+        if (expanded) {
+            validRows.forEach((row) => {
+                const rowid = handleGetRowId(row);
+                if (!rowGroupExpandedMaps[rowid]) {
+                    const rowRest = fullAllDataRowIdData[rowid];
+                    if (rowRest) {
+                        if (row[mapChildrenField] && row[mapChildrenField].length) {
+                            rowGroupExpandedMaps[rowid] = row;
+                        }
+                    }
+                }
+            });
+        }
+        else {
+            validRows.forEach(item => {
+                const rowid = handleGetRowId(item);
+                if (rowGroupExpandedMaps[rowid]) {
+                    delete rowGroupExpandedMaps[rowid];
+                }
+            });
+        }
+    }
+    reactData.rowGroupExpandedFlag++;
+    return $xeTable.recalculate();
+}
+/**
+ * 行分组的展开与收起
+ * @param rows
+ * @param expanded
+ * @returns
+ */
+function handleRowGroupVirtualExpand($xeTable, rows, expanded) {
+    const reactData = $xeTable;
+    return handleRowGroupBaseExpand($xeTable, rows, expanded).then(() => {
+        handleVirtualTreeToList($xeTable);
+        $xeTable.handleTableData();
+        reactData.rowGroupExpandedFlag++;
         updateAfterDataIndex($xeTable);
         return $xeTable.$nextTick();
     }).then(() => {
@@ -461,20 +548,23 @@ function updateAfterDataIndex($xeTable) {
     }
 }
 /**
- * 如果为虚拟树，将树结构拍平
+ * 如果为虚拟树、行分组、则将树结构拍平
  * @returns
  */
 function handleVirtualTreeToList($xeTable) {
     const props = $xeTable;
+    const reactData = $xeTable;
     const internalData = $xeTable;
     const { treeConfig } = props;
-    const { fullAllDataRowIdData, treeExpandedMaps } = internalData;
+    const { isRowGroupStatus } = reactData;
+    const { fullAllDataRowIdData, treeExpandedMaps, rowGroupExpandedMaps } = internalData;
+    const rowGroupOpts = $xeTable.computeRowGroupOpts;
     const treeOpts = $xeTable.computeTreeOpts;
-    const childrenField = treeOpts.children || treeOpts.childrenField;
+    const { handleGetRowId } = createHandleGetRowId($xeTable);
+    const fullData = [];
+    const expandMaps = {};
     if (treeConfig && treeOpts.transform) {
-        const { handleGetRowId } = createHandleGetRowId($xeTable);
-        const fullData = [];
-        const expandMaps = {};
+        const childrenField = treeOpts.children || treeOpts.childrenField;
         XEUtils.eachTree(internalData.afterTreeFullData, (row, index, items, path, parentRow) => {
             const rowid = handleGetRowId(row);
             const parentRowid = handleGetRowId(parentRow);
@@ -491,8 +581,249 @@ function handleVirtualTreeToList($xeTable) {
         updateScrollYStatus($xeTable, fullData);
         return fullData;
     }
+    else if (isRowGroupStatus) {
+        const { childrenField } = rowGroupOpts;
+        XEUtils.eachTree(internalData.afterGroupFullData, (row, index, items, path, parentRow) => {
+            const rowid = handleGetRowId(row);
+            const parentRowid = handleGetRowId(parentRow);
+            if (!parentRow || (expandMaps[parentRowid] && rowGroupExpandedMaps[parentRowid])) {
+                const rowRest = fullAllDataRowIdData[rowid];
+                if (rowRest) {
+                    rowRest._index = fullData.length;
+                }
+                expandMaps[rowid] = 1;
+                fullData.push(row);
+            }
+        }, { children: childrenField });
+        internalData.afterFullData = fullData;
+        updateScrollYStatus($xeTable, fullData);
+        return fullData;
+    }
     return internalData.afterFullData;
 }
+/**
+ * 编译处理后全量的表格数据
+ * 如果存在筛选条件，继续处理
+ */
+function updateAfterFullData($xeTable) {
+    const props = $xeTable;
+    const reactData = $xeTable;
+    const internalData = $xeTable;
+    const { treeConfig } = props;
+    const { isRowGroupStatus } = reactData;
+    const { tableFullColumn, tableFullData, tableFullTreeData, tableFullGroupData } = internalData;
+    const filterOpts = $xeTable.computeFilterOpts;
+    const sortOpts = $xeTable.computeSortOpts;
+    const rowGroupOpts = $xeTable.computeRowGroupOpts;
+    const treeOpts = $xeTable.computeTreeOpts;
+    const childrenField = treeOpts.children || treeOpts.childrenField;
+    const { transform, rowField, parentField, mapChildrenField } = treeOpts;
+    const { isEvery, remote: allRemoteFilter, filterMethod: allFilterMethod } = filterOpts;
+    const { remote: allRemoteSort, sortMethod: allSortMethod, multiple: sortMultiple, chronological } = sortOpts;
+    let tableData = [];
+    let tableTree = [];
+    // 处理数据
+    if (!allRemoteFilter || !allRemoteSort) {
+        const filterColumns = [];
+        let orderColumns = [];
+        tableFullColumn.forEach((column) => {
+            const { field, sortable, order, filters } = column;
+            if (!allRemoteFilter && filters && filters.length) {
+                const valueList = [];
+                const itemList = [];
+                filters.forEach((item) => {
+                    if (item.checked) {
+                        itemList.push(item);
+                        valueList.push(item.value);
+                    }
+                });
+                if (itemList.length) {
+                    filterColumns.push({ column, valueList, itemList });
+                }
+            }
+            if (!allRemoteSort && sortable && order) {
+                orderColumns.push({ column, field, property: field, order: order, sortTime: column.sortTime });
+            }
+        });
+        if (sortMultiple && chronological && orderColumns.length > 1) {
+            orderColumns = XEUtils.orderBy(orderColumns, 'sortTime');
+        }
+        // 处理筛选
+        // 支持单列、多列、组合筛选
+        if (!allRemoteFilter && filterColumns.length) {
+            const handleFilter = (row) => {
+                return filterColumns.every(({ column, valueList, itemList }) => {
+                    const { filterMethod, filterRender } = column;
+                    const compConf = isEnableConf(filterRender) ? renderer.get(filterRender.name) : null;
+                    const compFilterMethod = compConf ? (compConf.tableFilterMethod || compConf.filterMethod) : null;
+                    const tdFilterMethod = compConf ? (compConf.tableFilterDefaultMethod || compConf.defaultTableFilterMethod || compConf.defaultFilterMethod) : null;
+                    const cellValue = getCellValue(row, column);
+                    if (filterMethod) {
+                        return itemList.some((item) => filterMethod({ value: item.value, option: item, cellValue, row, column, $table: $xeTable }));
+                    }
+                    else if (compFilterMethod) {
+                        return itemList.some((item) => compFilterMethod({ value: item.value, option: item, cellValue, row, column, $table: $xeTable }));
+                    }
+                    else if (allFilterMethod) {
+                        return allFilterMethod({ $table: $xeTable, options: itemList, values: valueList, cellValue, row, column });
+                    }
+                    else if (tdFilterMethod) {
+                        return itemList.some((item) => tdFilterMethod({ value: item.value, option: item, cellValue, row, column, $table: $xeTable }));
+                    }
+                    return valueList.indexOf(XEUtils.get(row, column.field)) > -1;
+                });
+            };
+            if (isRowGroupStatus) {
+                // 行分组
+                tableTree = XEUtils.searchTree(tableFullGroupData, handleFilter, {
+                    original: true,
+                    isEvery: true,
+                    children: rowGroupOpts.mapChildrenField,
+                    mapChildren: rowGroupOpts.childrenField
+                });
+                tableData = tableTree;
+            }
+            else if (treeConfig && transform) {
+                // 筛选虚拟树
+                tableTree = XEUtils.searchTree(tableFullTreeData, handleFilter, {
+                    original: true,
+                    isEvery,
+                    children: mapChildrenField,
+                    mapChildren: childrenField
+                });
+                tableData = tableTree;
+            }
+            else {
+                tableData = treeConfig ? tableFullTreeData.filter(handleFilter) : tableFullData.filter(handleFilter);
+                tableTree = tableData;
+            }
+        }
+        else {
+            if (isRowGroupStatus) {
+                // 还原行分组
+                tableTree = XEUtils.searchTree(tableFullGroupData, () => true, {
+                    original: true,
+                    isEvery: true,
+                    children: rowGroupOpts.mapChildrenField,
+                    mapChildren: rowGroupOpts.childrenField
+                });
+                tableData = tableTree;
+            }
+            else if (treeConfig && transform) {
+                // 还原虚拟树
+                tableTree = XEUtils.searchTree(tableFullTreeData, () => true, {
+                    original: true,
+                    isEvery,
+                    children: mapChildrenField,
+                    mapChildren: childrenField
+                });
+                tableData = tableTree;
+            }
+            else {
+                tableData = treeConfig ? tableFullTreeData.slice(0) : tableFullData.slice(0);
+                tableTree = tableData;
+            }
+        }
+        // 处理排序
+        // 支持单列、多列、组合排序
+        if (!allRemoteSort && orderColumns.length) {
+            if (isRowGroupStatus) {
+                // 行分组的排序
+                if (allSortMethod) {
+                    const sortRests = allSortMethod({ data: tableTree, sortList: orderColumns, $table: $xeTable });
+                    tableTree = XEUtils.isArray(sortRests) ? sortRests : tableTree;
+                }
+                else {
+                    const treeList = XEUtils.toTreeArray(tableTree, {
+                        key: rowGroupOpts.rowField,
+                        parentKey: rowGroupOpts.parentField,
+                        children: rowGroupOpts.mapChildrenField
+                    });
+                    tableTree = XEUtils.toArrayTree(XEUtils.orderBy(treeList, orderColumns.map(({ column, order }) => [getOrderField($xeTable, column), order])), {
+                        key: rowGroupOpts.rowField,
+                        parentKey: rowGroupOpts.parentField,
+                        children: rowGroupOpts.childrenField,
+                        mapChildren: rowGroupOpts.mapChildrenField
+                    });
+                }
+                tableData = tableTree;
+            }
+            else if (treeConfig && transform) {
+                // 虚拟树的排序
+                if (allSortMethod) {
+                    const sortRests = allSortMethod({ data: tableTree, sortList: orderColumns, $table: $xeTable });
+                    tableTree = XEUtils.isArray(sortRests) ? sortRests : tableTree;
+                }
+                else {
+                    const treeList = XEUtils.toTreeArray(tableTree, {
+                        children: mapChildrenField
+                    });
+                    tableTree = XEUtils.toArrayTree(XEUtils.orderBy(treeList, orderColumns.map(({ column, order }) => [getOrderField($xeTable, column), order])), {
+                        key: rowField,
+                        parentKey: parentField,
+                        children: childrenField,
+                        mapChildren: mapChildrenField
+                    });
+                }
+                tableData = tableTree;
+            }
+            else {
+                if (allSortMethod) {
+                    const sortRests = allSortMethod({ data: tableData, sortList: orderColumns, $table: $xeTable });
+                    tableData = XEUtils.isArray(sortRests) ? sortRests : tableData;
+                }
+                else {
+                    // 兼容 v4
+                    if (sortMultiple) {
+                        tableData = XEUtils.orderBy(tableData, orderColumns.map(({ column, order }) => [getOrderField($xeTable, column), order]));
+                    }
+                    else {
+                        const firstOrderColumn = orderColumns[0];
+                        let sortByConfs;
+                        // 已废弃，兼容 v2，在 v4 中废弃， sortBy 不能为数组
+                        if (XEUtils.isArray(firstOrderColumn.sortBy)) {
+                            sortByConfs = firstOrderColumn.sortBy.map((item) => [item, firstOrderColumn.order]);
+                        }
+                        tableData = XEUtils.orderBy(tableData, sortByConfs || [firstOrderColumn].map(({ column, order }) => [getOrderField($xeTable, column), order]));
+                    }
+                    tableData = XEUtils.orderBy(tableData, orderColumns.map(({ column, order }) => [getOrderField($xeTable, column), order]));
+                }
+                tableTree = tableData;
+            }
+        }
+    }
+    else {
+        if (isRowGroupStatus) {
+            // 还原行分组
+            // 还原虚拟树
+            tableTree = XEUtils.searchTree(tableFullGroupData, () => true, {
+                original: true,
+                isEvery: true,
+                children: rowGroupOpts.mapChildrenField,
+                mapChildren: rowGroupOpts.childrenField
+            });
+            tableData = tableTree;
+        }
+        else if (treeConfig && transform) {
+            // 还原虚拟树
+            tableTree = XEUtils.searchTree(tableFullTreeData, () => true, {
+                original: true,
+                isEvery,
+                children: mapChildrenField,
+                mapChildren: childrenField
+            });
+            tableData = tableTree;
+        }
+        else {
+            tableData = treeConfig ? tableFullTreeData.slice(0) : tableFullData.slice(0);
+            tableTree = tableData;
+        }
+    }
+    internalData.afterFullData = tableData;
+    internalData.afterTreeFullData = tableTree;
+    internalData.afterGroupFullData = tableTree;
+    updateAfterDataIndex($xeTable);
+}
 function updateStyle($xeTable) {
     const props = $xeTable;
     const reactData = $xeTable;
@@ -903,7 +1234,7 @@ function handleCheckedRadioRow($xeTable, row, isForce) {
     const reactData = $xeTable;
     const radioOpts = $xeTable.computeRadioOpts;
     const { checkMethod } = radioOpts;
-    if (row && (isForce || (!checkMethod || checkMethod({ row })))) {
+    if (row && (isForce || (!checkMethod || checkMethod({ $table: $xeTable, row })))) {
         reactData.selectRadioRow = row;
         handleRadioReserveRow($xeTable, row);
     }
@@ -922,8 +1253,10 @@ function handleCheckedAllCheckboxRow($xeTable, checked, isForce) {
     const reactData = $xeTable;
     const internalData = $xeTable;
     const { treeConfig } = props;
-    const { afterFullData, checkboxReserveRowMap, selectCheckboxMaps } = internalData;
+    const { isRowGroupStatus } = reactData;
+    const { afterFullData, afterTreeFullData, afterGroupFullData, checkboxReserveRowMap, selectCheckboxMaps } = internalData;
     const treeOpts = $xeTable.computeTreeOpts;
+    const rowGroupOpts = $xeTable.computeRowGroupOpts;
     const childrenField = treeOpts.children || treeOpts.childrenField;
     const checkboxOpts = $xeTable.computeCheckboxOpts;
     const { checkField, reserve, checkMethod } = checkboxOpts;
@@ -932,24 +1265,24 @@ function handleCheckedAllCheckboxRow($xeTable, checked, isForce) {
     const indeterminateField = checkboxOpts.indeterminateField || checkboxOpts.halfField;
     const selectRowMaps = {};
     /**
-     * 绑定属性方式（高性能，有污染）
+     * 绑定属性方式（有污染）
      * 必须在行数据存在对应的属性，否则将不响应
      */
     if (checkField) {
         const checkValFn = (row) => {
-            if (isForce || (!checkMethod || checkMethod({ row }))) {
+            if (isForce || (!checkMethod || checkMethod({ $table: $xeTable, row }))) {
                 if (checked) {
                     selectRowMaps[handleGetRowId(row)] = row;
                 }
                 XEUtils.set(row, checkField, checked);
             }
-            if (treeConfig && indeterminateField) {
+            if ((treeConfig || isRowGroupStatus) && indeterminateField) {
                 XEUtils.set(row, indeterminateField, false);
             }
         };
         // 如果存在选中方法
         // 如果方法成立，则更新值，否则忽略该数据
-        if (treeConfig) {
+        if ((treeConfig || isRowGroupStatus)) {
             XEUtils.eachTree(afterFullData, checkValFn, { children: childrenField });
         }
         else {
@@ -958,17 +1291,45 @@ function handleCheckedAllCheckboxRow($xeTable, checked, isForce) {
     }
     else {
         /**
-           * 默认方式（低性能，无污染）
-           * 无需任何属性，直接绑定
-           */
-        if (treeConfig) {
+         * 默认方式（无污染）
+         * 无需任何属性，直接绑定
+         */
+        if (isRowGroupStatus) {
             if (checked) {
                 /**
-                   * 如果是树勾选
-                   * 如果方法成立，则添加到临时集合中
-                   */
-                XEUtils.eachTree(afterFullData, (row) => {
-                    if (isForce || (!checkMethod || checkMethod({ row }))) {
+                 * 如果是行分组勾选
+                 * 如果方法成立，则添加到临时集合中
+                 */
+                XEUtils.eachTree(afterGroupFullData, (row) => {
+                    if (isForce || (!checkMethod || checkMethod({ $table: $xeTable, row }))) {
+                        const rowid = handleGetRowId(row);
+                        selectRowMaps[rowid] = row;
+                    }
+                }, { children: rowGroupOpts.mapChildrenField });
+            }
+            else {
+                /**
+                 * 如果是树取消
+                 * 如果方法成立，则不添加到临时集合中
+                 */
+                if (!isForce && checkMethod) {
+                    XEUtils.eachTree(afterGroupFullData, (row) => {
+                        const rowid = handleGetRowId(row);
+                        if (checkMethod({ $table: $xeTable, row }) ? false : selectCheckboxMaps[rowid]) {
+                            selectRowMaps[rowid] = row;
+                        }
+                    }, { children: rowGroupOpts.mapChildrenField });
+                }
+            }
+        }
+        else if (treeConfig) {
+            if (checked) {
+                /**
+                 * 如果是树勾选
+                 * 如果方法成立，则添加到临时集合中
+                 */
+                XEUtils.eachTree(afterTreeFullData, (row) => {
+                    if (isForce || (!checkMethod || checkMethod({ $table: $xeTable, row }))) {
                         const rowid = handleGetRowId(row);
                         selectRowMaps[rowid] = row;
                     }
@@ -976,13 +1337,13 @@ function handleCheckedAllCheckboxRow($xeTable, checked, isForce) {
             }
             else {
                 /**
-                   * 如果是树取消
-                   * 如果方法成立，则不添加到临时集合中
-                   */
+                 * 如果是树取消
+                 * 如果方法成立，则不添加到临时集合中
+                 */
                 if (!isForce && checkMethod) {
-                    XEUtils.eachTree(afterFullData, (row) => {
+                    XEUtils.eachTree(afterTreeFullData, (row) => {
                         const rowid = handleGetRowId(row);
-                        if (checkMethod({ row }) ? 0 : selectCheckboxMaps[rowid]) {
+                        if (checkMethod({ $table: $xeTable, row }) ? false : selectCheckboxMaps[rowid]) {
                             selectRowMaps[rowid] = row;
                         }
                     }, { children: childrenField });
@@ -992,14 +1353,14 @@ function handleCheckedAllCheckboxRow($xeTable, checked, isForce) {
         else {
             if (checked) {
                 /**
-                   * 如果是行勾选
-                   * 如果存在选中方法且成立或者本身已勾选，则添加到临时集合中
-                   * 如果不存在选中方法，则添加所有数据到临时集合中
-                   */
+                 * 如果是行勾选
+                 * 如果存在选中方法且成立或者本身已勾选，则添加到临时集合中
+                 * 如果不存在选中方法，则添加所有数据到临时集合中
+                 */
                 if (!isForce && checkMethod) {
                     afterFullData.forEach((row) => {
                         const rowid = handleGetRowId(row);
-                        if (selectCheckboxMaps[rowid] || checkMethod({ row })) {
+                        if (selectCheckboxMaps[rowid] || checkMethod({ $table: $xeTable, row })) {
                             selectRowMaps[rowid] = row;
                         }
                     });
@@ -1013,14 +1374,14 @@ function handleCheckedAllCheckboxRow($xeTable, checked, isForce) {
             }
             else {
                 /**
-                   * 如果是行取消
-                   * 如果方法成立，则不添加到临时集合中；如果方法不成立则判断当前是否已勾选，如果已被勾选则添加到新集合中
-                   * 如果不存在选中方法，无需处理，临时集合默认为空
-                   */
+                 * 如果是行取消
+                 * 如果方法成立，则不添加到临时集合中；如果方法不成立则判断当前是否已勾选，如果已被勾选则添加到新集合中
+                 * 如果不存在选中方法，无需处理，临时集合默认为空
+                 */
                 if (!isForce && checkMethod) {
                     afterFullData.forEach((row) => {
                         const rowid = handleGetRowId(row);
-                        if (checkMethod({ row }) ? 0 : selectCheckboxMaps[rowid]) {
+                        if (checkMethod({ $table: $xeTable, row }) ? false : selectCheckboxMaps[rowid]) {
                             selectRowMaps[rowid] = row;
                         }
                     });
@@ -1764,9 +2125,11 @@ function updateRowDropTipContent($xeTable, tdEl) {
     const rTooltipMethod = tooltipMethod || (dragConfig ? dragConfig.rowTooltipMethod : null);
     let tipContent = '';
     if (rTooltipMethod) {
-        tipContent = `${rTooltipMethod({
+        const rtParams = {
+            $table: $xeTable,
             row: dragRow
-        }) || ''}`;
+        };
+        tipContent = `${rTooltipMethod(rtParams) || ''}`;
     }
     else {
         tipContent = getI18n('vxe.table.dragTip', [tdEl.textContent || '']);
@@ -1803,9 +2166,11 @@ function updateColDropTipContent($xeTable, tdEl) {
     const { tooltipMethod } = columnDragOpts;
     let tipContent = '';
     if (tooltipMethod) {
-        tipContent = `${tooltipMethod({
+        const dtParams = {
+            $table: $xeTable,
             column: dragCol
-        }) || ''}`;
+        };
+        tipContent = `${tooltipMethod(dtParams) || ''}`;
     }
     else {
         tipContent = getI18n('vxe.table.dragTip', [tdEl.textContent || '']);
@@ -2105,6 +2470,265 @@ function handleRecalculateLayout($xeTable, reFull) {
         }
     });
 }
+const handleUpdateRowGroup = ($xeTable, groupFields) => {
+    const reactData = $xeTable;
+    reactData.rowGroupList = groupFields
+        ? (XEUtils.isArray(groupFields) ? groupFields : [groupFields]).map(field => {
+            return {
+                field
+            };
+        })
+        : [];
+};
+function handleGroupData($xeTable, list, rowGroups) {
+    let fullData = list;
+    let treeData = list;
+    if (rowGroups) {
+        const rowGroupOpts = $xeTable.computeRowGroupOpts;
+        const { rowField, parentField, childrenField, mapChildrenField } = rowGroupOpts;
+        const checkboxOpts = $xeTable.computeCheckboxOpts;
+        const { checkField } = checkboxOpts;
+        const indeterminateField = checkboxOpts.indeterminateField || checkboxOpts.halfField;
+        const rgItem = rowGroups[0];
+        if (rgItem && rowField && parentField && childrenField && mapChildrenField) {
+            fullData = [];
+            treeData = [];
+            const groupField = rgItem.field;
+            const groupColumn = $xeTable.getColumnByField(groupField);
+            const groupMaps = {};
+            const rowkey = getRowkey($xeTable);
+            list.forEach((row) => {
+                const cellValue = groupColumn ? $xeTable.getCellLabel(row, groupColumn) : XEUtils.get(row, groupField);
+                const groupValue = XEUtils.eqNull(cellValue) ? '' : cellValue;
+                let childList = groupMaps[groupValue];
+                if (!childList) {
+                    childList = [];
+                    groupMaps[groupValue] = childList;
+                }
+                if (row.isAggregate) {
+                    row.isAggregate = undefined;
+                }
+                childList.push(row);
+            });
+            XEUtils.objectEach(groupMaps, (childList, groupValue) => {
+                const { fullData: childFullData, treeData: childTreeData } = handleGroupData($xeTable, childList, rowGroups.slice(1));
+                const groupRow = {
+                    isAggregate: true,
+                    groupContent: groupValue,
+                    groupField,
+                    [rowField]: getRowUniqueId(),
+                    [parentField]: null,
+                    [rowkey]: getRowUniqueId(),
+                    [childrenField]: childTreeData,
+                    [mapChildrenField]: childTreeData
+                };
+                if (checkField) {
+                    groupRow[checkField] = false;
+                }
+                if (indeterminateField) {
+                    groupRow[indeterminateField] = false;
+                }
+                treeData.push(groupRow);
+                fullData.push(groupRow);
+                if (childFullData.length) {
+                    fullData.push(...childFullData);
+                }
+            });
+        }
+    }
+    return {
+        treeData,
+        fullData
+    };
+}
+/**
+ * 加载表格数据
+ * @param {Array} datas 数据
+ */
+function loadTableData($xeTable, datas, isReset) {
+    const props = $xeTable;
+    const reactData = $xeTable;
+    const internalData = $xeTable;
+    const { keepSource, treeConfig, rowGroupConfig } = props;
+    const { rowGroupList, scrollYLoad: oldScrollYLoad } = reactData;
+    const { scrollYStore, scrollXStore, lastScrollLeft, lastScrollTop } = internalData;
+    const rowOpts = $xeTable.computeRowOpts;
+    const treeOpts = $xeTable.computeTreeOpts;
+    const expandOpts = $xeTable.computeExpandOpts;
+    const { transform } = treeOpts;
+    const childrenField = treeOpts.children || treeOpts.childrenField;
+    let treeData = [];
+    let fullData = datas ? datas.slice(0) : []; // 转为响应式数据
+    if (fullData.length > supportMaxRow) {
+        errLog('vxe.error.errMaxRow', [supportMaxRow]);
+    }
+    if (treeConfig && rowGroupList.length) {
+        errLog('vxe.error.noTree', ['row-group-config']);
+        return $xeTable.$nextTick();
+    }
+    if (rowOpts.drag && rowGroupList.length) {
+        errLog('vxe.error.errConflicts', ['row-config.drag', 'row-group-config']);
+        return $xeTable.$nextTick();
+    }
+    let isRGroup = false;
+    if (treeConfig) {
+        if (transform) {
+            // 树结构自动转换
+            if (!treeOpts.rowField) {
+                errLog('vxe.error.reqProp', ['tree-config.rowField']);
+            }
+            if (!treeOpts.parentField) {
+                errLog('vxe.error.reqProp', ['tree-config.parentField']);
+            }
+            if (!childrenField) {
+                errLog('vxe.error.reqProp', ['tree-config.childrenField']);
+            }
+            if (!treeOpts.mapChildrenField) {
+                errLog('vxe.error.reqProp', ['tree-config.mapChildrenField']);
+            }
+            if (childrenField === treeOpts.mapChildrenField) {
+                errLog('vxe.error.errConflicts', ['tree-config.childrenField', 'tree-config.mapChildrenField']);
+            }
+            // fullData.forEach(row => {
+            //   if (row[treeOpts.children] && row[treeOpts.children].length) {
+            //     warnLog('vxe.error.errConflicts', ['tree-config.transform', `row.${treeOpts.children}`])
+            //   }
+            // })
+            treeData = XEUtils.toArrayTree(fullData, {
+                key: treeOpts.rowField,
+                parentKey: treeOpts.parentField,
+                children: childrenField,
+                mapChildren: treeOpts.mapChildrenField
+            });
+            fullData = treeData.slice(0);
+        }
+        else {
+            treeData = fullData.slice(0);
+        }
+    }
+    else if (rowGroupConfig && rowGroupList.length) {
+        const groupRest = handleGroupData($xeTable, fullData, rowGroupList);
+        treeData = groupRest.treeData;
+        fullData = groupRest.fullData;
+        isRGroup = true;
+    }
+    reactData.isRowGroupStatus = isRGroup;
+    scrollYStore.startIndex = 0;
+    scrollYStore.endIndex = 1;
+    scrollXStore.startIndex = 0;
+    scrollXStore.endIndex = 1;
+    reactData.isRowLoading = true;
+    reactData.scrollVMLoading = false;
+    internalData.treeExpandedMaps = {};
+    reactData.treeExpandedFlag++;
+    internalData.rowExpandedMaps = {};
+    reactData.rowExpandedFlag++;
+    internalData.insertRowMaps = {};
+    reactData.insertRowFlag++;
+    internalData.removeRowMaps = {};
+    reactData.removeRowFlag++;
+    const sYLoad = updateScrollYStatus($xeTable, fullData);
+    reactData.isDragColMove = false;
+    reactData.isDragRowMove = false;
+    // 全量数据
+    internalData.tableFullData = fullData;
+    internalData.tableFullTreeData = isRGroup ? [] : treeData;
+    internalData.tableFullGroupData = isRGroup ? treeData : [];
+    // 缓存数据
+    $xeTable.cacheRowMap(isReset);
+    // 原始数据
+    internalData.tableSynchData = datas;
+    if (isReset) {
+        internalData.isResizeCellHeight = false;
+    }
+    // 克隆原数据，用于显示编辑状态，与编辑值做对比
+    if (keepSource) {
+        $xeTable.cacheSourceMap(fullData);
+    }
+    if ($xeTable.clearCellAreas && props.mouseConfig) {
+        $xeTable.clearCellAreas();
+        $xeTable.clearCopyCellArea();
+    }
+    $xeTable.clearMergeCells();
+    $xeTable.clearMergeFooterItems();
+    $xeTable.handleTableData(true);
+    $xeTable.updateFooter();
+    $xeTable.handleUpdateBodyMerge();
+    return $xeTable.$nextTick().then(() => {
+        updateHeight($xeTable);
+        updateStyle($xeTable);
+    }).then(() => {
+        computeScrollLoad($xeTable);
+    }).then(() => {
+        // 是否启用了虚拟滚动
+        if (sYLoad) {
+            scrollYStore.endIndex = scrollYStore.visibleSize;
+        }
+        if (sYLoad) {
+            if (reactData.expandColumn && expandOpts.mode !== 'fixed') {
+                errLog('vxe.error.notConflictProp', ['column.type="expand', 'expand-config.mode="fixed"']);
+            }
+            // if (showOverflow) {
+            //   if (!rowOpts.height) {
+            //     const errColumn = internalData.tableFullColumn.find(column => column.showOverflow === false)
+            //     if (errColumn) {
+            //       errLog('vxe.error.errProp', [`column[field="${errColumn.field}"].show-overflow=false`, 'show-overflow=true'])
+            //     }
+            //   }
+            // }
+            if (!(props.height || props.maxHeight)) {
+                errLog('vxe.error.reqProp', ['table.height | table.max-height | table.scroll-y={enabled: false}']);
+            }
+            // if (!props.showOverflow) {
+            //   warnLog('vxe.error.reqProp', ['table.show-overflow'])
+            // }
+            if (props.spanMethod) {
+                errLog('vxe.error.scrollErrProp', ['table.span-method']);
+            }
+        }
+        handleReserveStatus($xeTable);
+        $xeTable.checkSelectionStatus();
+        return new Promise(resolve => {
+            $xeTable.$nextTick()
+                .then(() => handleRecalculateLayout($xeTable, false))
+                .then(() => {
+                calcCellHeight($xeTable);
+                updateRowOffsetTop($xeTable);
+                return handleRecalculateLayout($xeTable, false);
+            })
+                .then(() => {
+                let targetScrollLeft = lastScrollLeft;
+                let targetScrollTop = lastScrollTop;
+                const virtualXOpts = $xeTable.computeVirtualXOpts;
+                const virtualYOpts = $xeTable.computeVirtualYOpts;
+                // 是否在更新数据之后自动滚动重置滚动条
+                if (virtualXOpts.scrollToLeftOnChange) {
+                    targetScrollLeft = 0;
+                }
+                if (virtualYOpts.scrollToTopOnChange) {
+                    targetScrollTop = 0;
+                }
+                reactData.isRowLoading = false;
+                handleRecalculateLayout($xeTable, false);
+                // 是否变更虚拟滚动
+                if (oldScrollYLoad === sYLoad) {
+                    restoreScrollLocation($xeTable, targetScrollLeft, targetScrollTop)
+                        .then(() => {
+                        resolve();
+                    });
+                }
+                else {
+                    setTimeout(() => {
+                        restoreScrollLocation($xeTable, targetScrollLeft, targetScrollTop)
+                            .then(() => {
+                            resolve();
+                        });
+                    });
+                }
+            });
+        });
+    });
+}
 /**
  * 处理数据加载默认行为
  * 默认执行一次，除非被重置
@@ -2768,16 +3392,23 @@ const Methods = {
     clearAll() {
         return clearTableAllStatus(this);
     },
+    handleUpdateRowGroup(groupFields) {
+        const $xeTable = this;
+        handleUpdateRowGroup($xeTable, groupFields);
+    },
     /**
      * 同步 data 数据（即将废弃）
      * 如果用了该方法，那么组件将不再记录增删改的状态，只能自行实现对应逻辑
      * 对于某些特殊的场景，比如深层树节点元素发生变动时可能会用到
      */
     syncData() {
+        const $xeTable = this;
+        const reactData = $xeTable;
+        const internalData = $xeTable;
         errLog('vxe.error.delFunc', ['syncData', 'getData']);
-        return this.$nextTick().then(() => {
-            this.tableData = [];
-            return this.$nextTick().then(() => this.loadTableData(this.tableFullData, true));
+        return $xeTable.$nextTick().then(() => {
+            reactData.tableData = [];
+            return $xeTable.$nextTick().then(() => loadTableData($xeTable, internalData.tableFullData, true));
         });
     },
     /**
@@ -2800,205 +3431,48 @@ const Methods = {
                 return $xeTable.refreshScroll();
             }
         }).then(() => {
-            $xeTable.updateCellAreas();
-            return $xeTable.recalculate(true);
-        }).then(() => {
-            // 存在滚动行为未结束情况
-            setTimeout(() => $xeTable.recalculate(), 50);
-        });
-    },
-    handleTableData(force) {
-        const $xeTable = this;
-        const reactData = $xeTable;
-        const internalData = $xeTable;
-        const { scrollYLoad } = reactData;
-        const { scrollYStore, fullDataRowIdData } = internalData;
-        let fullList = internalData.afterFullData;
-        // 是否进行数据处理
-        if (force) {
-            // 更新数据，处理筛选和排序
-            this.updateAfterFullData();
-            // 如果为虚拟树，将树结构拍平
-            fullList = handleVirtualTreeToList($xeTable);
-        }
-        const tableData = scrollYLoad ? fullList.slice(scrollYStore.startIndex, scrollYStore.endIndex) : fullList.slice(0);
-        const visibleDataRowIdMaps = {};
-        tableData.forEach((row, $index) => {
-            const rowid = getRowid(this, row);
-            const rest = fullDataRowIdData[rowid];
-            if (rest) {
-                rest.$index = $index;
-            }
-            visibleDataRowIdMaps[rowid] = row;
-        });
-        this.tableData = tableData;
-        internalData.visibleDataRowIdData = visibleDataRowIdMaps;
-        return this.$nextTick();
-    },
-    /**
-     * 加载表格数据
-     * @param {Array} datas 数据
-     */
-    loadTableData(datas, isReset) {
-        const $xeTable = this;
-        const props = $xeTable;
-        const reactData = $xeTable;
-        const internalData = $xeTable;
-        const { keepSource, treeConfig } = props;
-        const { scrollYLoad: oldScrollYLoad } = reactData;
-        const { scrollYStore, scrollXStore, lastScrollLeft, lastScrollTop } = internalData;
-        const treeOpts = $xeTable.computeTreeOpts;
-        const expandOpts = $xeTable.computeExpandOpts;
-        const { transform } = treeOpts;
-        const childrenField = treeOpts.children || treeOpts.childrenField;
-        let treeData = [];
-        let fullData = datas ? datas.slice(0) : [];
-        if (fullData.length > supportMaxRow) {
-            errLog('vxe.error.errMaxRow', [supportMaxRow]);
-        }
-        if (treeConfig) {
-            // 树结构自动转换
-            if (transform) {
-                if (!treeOpts.rowField) {
-                    errLog('vxe.error.reqProp', ['table.tree-config.rowField']);
-                }
-                if (!treeOpts.parentField) {
-                    errLog('vxe.error.reqProp', ['table.tree-config.parentField']);
-                }
-                if (!childrenField) {
-                    errLog('vxe.error.reqProp', ['tree-config.childrenField']);
-                }
-                if (!treeOpts.mapChildrenField) {
-                    errLog('vxe.error.reqProp', ['tree-config.mapChildrenField']);
-                }
-                if (childrenField === treeOpts.mapChildrenField) {
-                    errLog('vxe.error.errConflicts', ['tree-config.childrenField', 'tree-config.mapChildrenField']);
-                }
-                // fullData.forEach(row => {
-                //   if (row[childrenField] && row[childrenField].length) {
-                //     warnLog('vxe.error.errConflicts', ['tree-config.transform', `row.${childrenField}`])
-                //   }
-                // })
-                treeData = XEUtils.toArrayTree(fullData, {
-                    key: treeOpts.rowField,
-                    parentKey: treeOpts.parentField,
-                    children: childrenField,
-                    mapChildren: treeOpts.mapChildrenField
-                });
-                fullData = treeData.slice(0);
-            }
-            else {
-                treeData = fullData.slice(0);
-            }
-        }
-        scrollYStore.startIndex = 0;
-        scrollYStore.endIndex = 1;
-        scrollXStore.startIndex = 0;
-        scrollXStore.endIndex = 1;
-        reactData.isRowLoading = true;
-        reactData.scrollVMLoading = false;
-        internalData.insertRowMaps = {};
-        internalData.removeRowMaps = {};
-        const sYLoad = updateScrollYStatus($xeTable, fullData);
-        reactData.isDragColMove = false;
-        reactData.isDragRowMove = false;
-        // 全量数据
-        internalData.tableFullData = fullData;
-        internalData.tableFullTreeData = treeData;
-        // 缓存数据
-        $xeTable.cacheRowMap(isReset);
-        // 原始数据
-        internalData.tableSynchData = datas;
-        if (isReset) {
-            internalData.isResizeCellHeight = false;
-        }
-        // 克隆原数据，用于显示编辑状态，与编辑值做对比
-        if (keepSource) {
-            $xeTable.cacheSourceMap(fullData);
-        }
-        if ($xeTable.clearCellAreas && props.mouseConfig) {
-            $xeTable.clearCellAreas();
-            $xeTable.clearCopyCellArea();
-        }
-        $xeTable.clearMergeCells();
-        $xeTable.clearMergeFooterItems();
-        $xeTable.handleTableData(true);
-        $xeTable.updateFooter();
-        $xeTable.handleUpdateBodyMerge();
-        return $xeTable.$nextTick().then(() => {
-            updateHeight($xeTable);
-            updateStyle($xeTable);
-        }).then(() => {
-            computeScrollLoad($xeTable);
+            $xeTable.updateCellAreas();
+            return $xeTable.recalculate(true);
         }).then(() => {
-            // 是否启用了虚拟滚动
-            if (sYLoad) {
-                scrollYStore.endIndex = scrollYStore.visibleSize;
-            }
-            if (sYLoad) {
-                if (reactData.expandColumn && expandOpts.mode !== 'fixed') {
-                    errLog('vxe.error.notConflictProp', ['column.type="expand', 'expand-config.mode="fixed"']);
-                }
-                // if (showOverflow) {
-                //   if (!rowOpts.height) {
-                //     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 (!(props.height || props.maxHeight)) {
-                    errLog('vxe.error.reqProp', ['table.height | table.max-height | table.scroll-y={enabled: false}']);
-                }
-                // if (!props.showOverflow) {
-                //   warnLog('vxe.error.reqProp', ['table.show-overflow'])
-                // }
-                if (props.spanMethod) {
-                    errLog('vxe.error.scrollErrProp', ['table.span-method']);
-                }
-            }
-            handleReserveStatus($xeTable);
-            $xeTable.checkSelectionStatus();
-            return new Promise(resolve => {
-                this.$nextTick()
-                    .then(() => handleRecalculateLayout($xeTable, false))
-                    .then(() => {
-                    calcCellHeight($xeTable);
-                    updateRowOffsetTop($xeTable);
-                    return handleRecalculateLayout($xeTable, false);
-                })
-                    .then(() => {
-                    let targetScrollLeft = lastScrollLeft;
-                    let targetScrollTop = lastScrollTop;
-                    const virtualXOpts = $xeTable.computeVirtualXOpts;
-                    const virtualYOpts = $xeTable.computeVirtualYOpts;
-                    // 是否在更新数据之后自动滚动重置滚动条
-                    if (virtualXOpts.scrollToLeftOnChange) {
-                        targetScrollLeft = 0;
-                    }
-                    if (virtualYOpts.scrollToTopOnChange) {
-                        targetScrollTop = 0;
-                    }
-                    reactData.isRowLoading = false;
-                    handleRecalculateLayout($xeTable, false);
-                    // 是否变更虚拟滚动
-                    if (oldScrollYLoad === sYLoad) {
-                        restoreScrollLocation($xeTable, targetScrollLeft, targetScrollTop)
-                            .then(() => {
-                            resolve();
-                        });
-                    }
-                    else {
-                        setTimeout(() => {
-                            restoreScrollLocation($xeTable, targetScrollLeft, targetScrollTop)
-                                .then(() => {
-                                resolve();
-                            });
-                        });
-                    }
-                });
-            });
+            // 存在滚动行为未结束情况
+            setTimeout(() => $xeTable.recalculate(), 50);
+        });
+    },
+    handleTableData(force) {
+        const $xeTable = this;
+        const reactData = $xeTable;
+        const internalData = $xeTable;
+        const { scrollYLoad } = reactData;
+        const { scrollYStore, fullDataRowIdData } = internalData;
+        let fullList = internalData.afterFullData;
+        // 是否进行数据处理
+        if (force) {
+            // 更新数据，处理筛选和排序
+            updateAfterFullData($xeTable);
+            // 如果为虚拟树，将树结构拍平
+            fullList = handleVirtualTreeToList($xeTable);
+        }
+        const tableData = scrollYLoad ? fullList.slice(scrollYStore.startIndex, scrollYStore.endIndex) : fullList.slice(0);
+        const visibleDataRowIdMaps = {};
+        tableData.forEach((row, $index) => {
+            const rowid = getRowid($xeTable, row);
+            const rest = fullDataRowIdData[rowid];
+            if (rest) {
+                rest.$index = $index;
+            }
+            visibleDataRowIdMaps[rowid] = row;
         });
+        reactData.tableData = tableData;
+        internalData.visibleDataRowIdData = visibleDataRowIdMaps;
+        return $xeTable.$nextTick();
+    },
+    /**
+     * 加载表格数据
+     * @param {Array} datas 数据
+     */
+    loadTableData(datas, isReset) {
+        const $xeTable = this;
+        return loadTableData($xeTable, datas, isReset);
     },
     /**
      * 重新加载数据，不会清空表格状态
@@ -3007,7 +3481,7 @@ const Methods = {
     loadData(datas) {
         const $xeTable = this;
         const { initStatus } = this;
-        return this.loadTableData(datas, false).then(() => {
+        return loadTableData($xeTable, datas, false).then(() => {
             this.inited = true;
             this.initStatus = true;
             if (!initStatus) {
@@ -3026,7 +3500,7 @@ const Methods = {
             .then(() => {
             this.inited = true;
             this.initStatus = true;
-            return this.loadTableData(datas, true);
+            return loadTableData($xeTable, datas, true);
         })
             .then(() => {
             handleLoadDefaults($xeTable);
@@ -3111,11 +3585,8 @@ const Methods = {
         const reactData = $xeTable;
         const internalData = $xeTable;
         const { treeConfig } = props;
-        const { fullAllDataRowIdData, tableFullData, tableFullTreeData, treeExpandedMaps } = internalData;
-        const treeOpts = $xeTable.computeTreeOpts;
-        const childrenField = treeOpts.children || treeOpts.childrenField;
-        const hasChildField = treeOpts.hasChild || treeOpts.hasChildField;
-        const { lazy } = treeOpts;
+        const { isRowGroupStatus } = reactData;
+        const { fullAllDataRowIdData, tableFullData, tableFullTreeData, tableFullGroupData, treeExpandedMaps } = internalData;
         const fullAllDataRowIdMaps = isReset ? {} : Object.assign({}, fullAllDataRowIdData); // 存在已删除数据
         const fullDataRowIdMaps = {};
         const { handleUpdateRowId } = createHandleUpdateRowId($xeTable);
@@ -3136,6 +3607,10 @@ const Methods = {
             fullAllDataRowIdMaps[rowid] = rowRest;
         };
         if (treeConfig) {
+            const treeOpts = $xeTable.computeTreeOpts;
+            const { lazy } = treeOpts;
+            const childrenField = treeOpts.children || treeOpts.childrenField;
+            const hasChildField = treeOpts.hasChild || treeOpts.hasChildField;
             XEUtils.eachTree(tableFullTreeData, (row, index, items, path, parentRow, nodes) => {
                 const rowid = handleUpdateRowId(row);
                 if (treeConfig && lazy) {
@@ -3151,6 +3626,14 @@ const Methods = {
                 handleRowCache(row, index, items, parentRow ? -1 : index, parentRow, rowid, nodes.length - 1, toTreePathSeq(path));
             }, { children: childrenField });
         }
+        else if (isRowGroupStatus) {
+            const rowGroupOpts = $xeTable.computeRowGroupOpts;
+            const { mapChildrenField } = rowGroupOpts;
+            XEUtils.eachTree(tableFullGroupData, (row, index, items, path, parentRow, nodes) => {
+                const rowid = handleUpdateRowId(row);
+                handleRowCache(row, index, items, parentRow ? -1 : index, parentRow, rowid, nodes.length - 1, toTreePathSeq(path));
+            }, { children: mapChildrenField });
+        }
         else {
             tableFullData.forEach((row, index, items) => {
                 handleRowCache(row, index, items, index, null, handleUpdateRowId(row), 0, index + 1);
@@ -3893,174 +4376,6 @@ const Methods = {
         }
         return rowList;
     },
-    /**
-     * 获取处理后全量的表格数据
-     * 如果存在筛选条件，继续处理
-     */
-    updateAfterFullData() {
-        const $xeTable = this;
-        const props = $xeTable;
-        const internalData = $xeTable;
-        const { treeConfig } = props;
-        const { tableFullColumn, tableFullData, tableFullTreeData } = internalData;
-        const filterOpts = $xeTable.computeFilterOpts;
-        const sortOpts = $xeTable.computeSortOpts;
-        const treeOpts = $xeTable.computeTreeOpts;
-        const childrenField = treeOpts.children || treeOpts.childrenField;
-        const { transform, rowField, parentField, mapChildrenField } = treeOpts;
-        const { isEvery, remote: allRemoteFilter, filterMethod: allFilterMethod } = filterOpts;
-        const { remote: allRemoteSort, sortMethod: allSortMethod, multiple: sortMultiple, chronological } = sortOpts;
-        let tableData = [];
-        let tableTree = [];
-        // 处理数据
-        if (!allRemoteFilter || !allRemoteSort) {
-            const filterColumns = [];
-            let orderColumns = [];
-            tableFullColumn.forEach((column) => {
-                const { field, sortable, order, filters } = column;
-                if (!allRemoteFilter && filters && filters.length) {
-                    const valueList = [];
-                    const itemList = [];
-                    filters.forEach((item) => {
-                        if (item.checked) {
-                            itemList.push(item);
-                            valueList.push(item.value);
-                        }
-                    });
-                    if (itemList.length) {
-                        filterColumns.push({ column, valueList, itemList });
-                    }
-                }
-                if (!allRemoteSort && sortable && order) {
-                    orderColumns.push({ column, field, property: field, order: order, sortTime: column.sortTime });
-                }
-            });
-            if (sortMultiple && chronological && orderColumns.length > 1) {
-                orderColumns = XEUtils.orderBy(orderColumns, 'sortTime');
-            }
-            // 处理筛选
-            // 支持单列、多列、组合筛选
-            if (!allRemoteFilter && filterColumns.length) {
-                const handleFilter = (row) => {
-                    return filterColumns.every(({ column, valueList, itemList }) => {
-                        const { filterMethod, filterRender } = column;
-                        const compConf = isEnableConf(filterRender) ? renderer.get(filterRender.name) : null;
-                        const compFilterMethod = compConf ? (compConf.tableFilterMethod || compConf.filterMethod) : null;
-                        const tdFilterMethod = compConf ? (compConf.tableFilterDefaultMethod || compConf.defaultTableFilterMethod || compConf.defaultFilterMethod) : null;
-                        const cellValue = getCellValue(row, column);
-                        if (filterMethod) {
-                            return itemList.some((item) => filterMethod({ value: item.value, option: item, cellValue, row, column, $table: $xeTable }));
-                        }
-                        else if (compFilterMethod) {
-                            return itemList.some((item) => compFilterMethod({ value: item.value, option: item, cellValue, row, column, $table: $xeTable }));
-                        }
-                        else if (allFilterMethod) {
-                            return allFilterMethod({ options: itemList, values: valueList, cellValue, row, column });
-                        }
-                        else if (tdFilterMethod) {
-                            return itemList.some((item) => tdFilterMethod({ value: item.value, option: item, cellValue, row, column, $table: $xeTable }));
-                        }
-                        return valueList.indexOf(XEUtils.get(row, column.field)) > -1;
-                    });
-                };
-                if (treeConfig && transform) {
-                    // 筛选虚拟树
-                    tableTree = XEUtils.searchTree(tableFullTreeData, handleFilter, {
-                        original: true,
-                        isEvery,
-                        children: mapChildrenField,
-                        mapChildren: childrenField
-                    });
-                    tableData = tableTree;
-                }
-                else {
-                    tableData = treeConfig ? tableFullTreeData.filter(handleFilter) : tableFullData.filter(handleFilter);
-                    tableTree = tableData;
-                }
-            }
-            else {
-                if (treeConfig && transform) {
-                    // 还原虚拟树
-                    tableTree = XEUtils.searchTree(tableFullTreeData, () => true, {
-                        original: true,
-                        isEvery,
-                        children: mapChildrenField,
-                        mapChildren: childrenField
-                    });
-                    tableData = tableTree;
-                }
-                else {
-                    tableData = treeConfig ? tableFullTreeData.slice(0) : tableFullData.slice(0);
-                    tableTree = tableData;
-                }
-            }
-            // 处理排序（不能用于树形结构）
-            // 支持单列、多列、组合排序
-            if (!allRemoteSort && orderColumns.length) {
-                if (treeConfig && transform) {
-                    // 虚拟树和列表一样，只能排序根级节点
-                    if (allSortMethod) {
-                        const sortRests = allSortMethod({ data: tableTree, sortList: orderColumns, $table: $xeTable });
-                        tableTree = XEUtils.isArray(sortRests) ? sortRests : tableTree;
-                    }
-                    else {
-                        const treeList = XEUtils.toTreeArray(tableTree, {
-                            children: mapChildrenField
-                        });
-                        tableTree = XEUtils.toArrayTree(XEUtils.orderBy(treeList, orderColumns.map(({ column, order }) => [getOrderField($xeTable, column), order])), {
-                            key: rowField,
-                            parentKey: parentField,
-                            children: childrenField,
-                            mapChildren: mapChildrenField
-                        });
-                    }
-                    tableData = tableTree;
-                }
-                else {
-                    if (allSortMethod) {
-                        const sortRests = allSortMethod({ data: tableData, sortList: orderColumns, $table: $xeTable });
-                        tableData = XEUtils.isArray(sortRests) ? sortRests : tableData;
-                    }
-                    else {
-                        // 兼容 v4
-                        if (sortMultiple) {
-                            tableData = XEUtils.orderBy(tableData, orderColumns.map(({ column, order }) => [getOrderField(this, column), order]));
-                        }
-                        else {
-                            const firstOrderColumn = orderColumns[0];
-                            let sortByConfs;
-                            // 已废弃，兼容 v2，在 v4 中废弃， sortBy 不能为数组
-                            if (XEUtils.isArray(firstOrderColumn.sortBy)) {
-                                sortByConfs = firstOrderColumn.sortBy.map((item) => [item, firstOrderColumn.order]);
-                            }
-                            tableData = XEUtils.orderBy(tableData, sortByConfs || [firstOrderColumn].map(({ column, order }) => [getOrderField(this, column), order]));
-                        }
-                        tableData = XEUtils.orderBy(tableData, orderColumns.map(({ column, order }) => [getOrderField($xeTable, column), order]));
-                    }
-                    tableTree = tableData;
-                }
-            }
-        }
-        else {
-            if (treeConfig && transform) {
-                // 还原虚拟树
-                tableTree = XEUtils.searchTree(tableFullTreeData, () => true, {
-                    original: true,
-                    isEvery,
-                    children: treeOpts.mapChildrenField,
-                    mapChildren: childrenField
-                });
-                tableData = tableTree;
-            }
-            else {
-                tableData = treeConfig ? tableFullTreeData.slice(0) : tableFullData.slice(0);
-                tableTree = tableData;
-            }
-        }
-        internalData.afterFullData = tableData;
-        internalData.afterTreeFullData = tableTree;
-        updateAfterDataIndex($xeTable);
-    },
     /**
      * 预编译
      * 对渲染中的数据提前解析序号及索引。牺牲提前编译耗时换取渲染中额外损耗，使运行时更加流畅
@@ -4401,7 +4716,7 @@ const Methods = {
             }
             const storeData = getCustomStorageMap(tableId);
             if (restoreStore) {
-                return Promise.resolve(restoreStore({ id: tableId, type: 'restore', storeData })).then(storeData => {
+                return Promise.resolve(restoreStore({ $table: $xeTable, id: tableId, type: 'restore', storeData })).then(storeData => {
                     if (!storeData) {
                         return;
                     }
@@ -4466,7 +4781,7 @@ const Methods = {
                 hasResizable = 1;
                 resizableData[colKey] = column.renderWidth;
             }
-            if (isCustomVisible && (!checkMethod || checkMethod({ column }))) {
+            if (isCustomVisible && (!checkMethod || checkMethod({ $table: $xeTable, column }))) {
                 if (!column.visible && column.defaultVisible) {
                     hasVisible = 1;
                     visibleData[colKey] = false;
@@ -4523,6 +4838,7 @@ const Methods = {
                 : this.getCustomStoreData();
             if (updateStore) {
                 return updateStore({
+                    $table: $xeTable,
                     id: tableId,
                     type,
                     storeData
@@ -5400,8 +5716,7 @@ const Methods = {
                 const hasDeleteKey = keyCode === 46;
                 const isF2 = keyCode === 113;
                 const isContextMenu = keyCode === 93;
-                const hasMetaKey = evnt.metaKey;
-                const hasCtrlKey = evnt.ctrlKey;
+                const isControlKey = hasControlKey(evnt);
                 const hasShiftKey = evnt.shiftKey;
                 const hasAltKey = evnt.altKey;
                 const operArrow = isLeftArrow || isUpArrow || isRightArrow || isDwArrow;
@@ -5471,7 +5786,7 @@ const Methods = {
                 else if (isEnter && !hasAltKey && keyboardConfig && keyboardOpts.isEnter && (selected.row || actived.row || (treeConfig && (rowOpts.isCurrent || highlightCurrentRow) && currentRow))) {
                     const { isLastEnterAppendRow, beforeEnterMethod, enterMethod } = keyboardOpts;
                     // 退出选中
-                    if (hasCtrlKey) {
+                    if (isControlKey) {
                         // 如果是激活编辑状态，则取消编辑
                         if (actived.row) {
                             const params = actived.args;
@@ -5652,7 +5967,7 @@ const Methods = {
                             .then(() => $xeTable.triggerCurrentRowEvent(evnt, params));
                     }
                 }
-                else if (keyboardConfig && keyboardOpts.isEdit && !hasCtrlKey && !hasMetaKey && (isSpacebar || (keyCode >= 48 && keyCode <= 57) || (keyCode >= 65 && keyCode <= 90) || (keyCode >= 96 && keyCode <= 111) || (keyCode >= 186 && keyCode <= 192) || (keyCode >= 219 && keyCode <= 222))) {
+                else if (keyboardConfig && keyboardOpts.isEdit && !isControlKey && (isSpacebar || (keyCode >= 48 && keyCode <= 57) || (keyCode >= 65 && keyCode <= 90) || (keyCode >= 96 && keyCode <= 111) || (keyCode >= 186 && keyCode <= 192) || (keyCode >= 219 && keyCode <= 222))) {
                     const { editMethod } = keyboardOpts;
                     // 启用编辑后，空格键功能将失效
                     // if (isSpacebar) {
@@ -6015,7 +6330,9 @@ const Methods = {
         const reactData = $xeTable;
         const internalData = $xeTable;
         const { treeConfig } = props;
+        const { isRowGroupStatus } = reactData;
         const { selectCheckboxMaps } = internalData;
+        const rowGroupOpts = $xeTable.computeRowGroupOpts;
         const treeOpts = $xeTable.computeTreeOpts;
         const { transform, mapChildrenField } = treeOpts;
         const childrenField = treeOpts.children || treeOpts.childrenField;
@@ -6026,10 +6343,10 @@ const Methods = {
         const indeterminateField = checkboxOpts.indeterminateField || checkboxOpts.halfField;
         if (checkField) {
             // 树结构
-            if (treeConfig && !checkStrictly) {
+            if ((treeConfig || isRowGroupStatus) && !checkStrictly) {
                 // 更新子节点状态
                 XEUtils.eachTree(rows, (row) => {
-                    if (isForce || (!checkMethod || checkMethod({ row }))) {
+                    if (isForce || (!checkMethod || checkMethod({ $table: $xeTable, row }))) {
                         XEUtils.set(row, checkField, checked);
                         if (indeterminateField) {
                             XEUtils.set(row, indeterminateField, false);
@@ -6042,7 +6359,7 @@ const Methods = {
             }
             // 列表
             rows.forEach(row => {
-                if (isForce || (!checkMethod || checkMethod({ row }))) {
+                if (isForce || (!checkMethod || checkMethod({ $table: $xeTable, row }))) {
                     XEUtils.set(row, checkField, checked);
                     handleCheckboxReserveRow($xeTable, row, checked);
                 }
@@ -6051,29 +6368,50 @@ const Methods = {
             return;
         }
         // 树结构
-        if (treeConfig && !checkStrictly) {
-            // 更新子节点状态
-            XEUtils.eachTree(rows, (row) => {
-                const rowid = handleGetRowId(row);
-                if (isForce || (!checkMethod || checkMethod({ row }))) {
-                    if (checked) {
-                        selectCheckboxMaps[rowid] = row;
+        if (!checkStrictly) {
+            if (isRowGroupStatus) {
+                // 更新行分组节点状态
+                XEUtils.eachTree(rows, (row) => {
+                    const rowid = handleGetRowId(row);
+                    if (isForce || (!checkMethod || checkMethod({ $table: $xeTable, row }))) {
+                        if (checked) {
+                            selectCheckboxMaps[rowid] = row;
+                        }
+                        else {
+                            if (selectCheckboxMaps[rowid]) {
+                                delete selectCheckboxMaps[rowid];
+                            }
+                        }
+                        handleCheckboxReserveRow($xeTable, row, checked);
                     }
-                    else {
-                        if (selectCheckboxMaps[rowid]) {
-                            delete selectCheckboxMaps[rowid];
+                }, { children: rowGroupOpts.mapChildrenField });
+                reactData.updateCheckboxFlag++;
+                return;
+            }
+            else if (treeConfig) {
+                // 更新子节点状态
+                XEUtils.eachTree(rows, (row) => {
+                    const rowid = handleGetRowId(row);
+                    if (isForce || (!checkMethod || checkMethod({ $table: $xeTable, row }))) {
+                        if (checked) {
+                            selectCheckboxMaps[rowid] = row;
+                        }
+                        else {
+                            if (selectCheckboxMaps[rowid]) {
+                                delete selectCheckboxMaps[rowid];
+                            }
                         }
+                        handleCheckboxReserveRow($xeTable, row, checked);
                     }
-                    handleCheckboxReserveRow($xeTable, row, checked);
-                }
-            }, { children: transform ? mapChildrenField : childrenField });
-            reactData.updateCheckboxFlag++;
-            return;
+                }, { children: transform ? mapChildrenField : childrenField });
+                reactData.updateCheckboxFlag++;
+                return;
+            }
         }
         // 列表
         rows.forEach(row => {
             const rowid = handleGetRowId(row);
-            if (isForce || (!checkMethod || checkMethod({ row }))) {
+            if (isForce || (!checkMethod || checkMethod({ $table: $xeTable, row }))) {
                 if (checked) {
                     if (!selectCheckboxMaps[rowid]) {
                         selectCheckboxMaps[rowid] = row;
@@ -6125,8 +6463,11 @@ const Methods = {
     triggerCheckRowEvent(evnt, params, checked) {
         const $xeTable = this;
         const props = $xeTable;
+        const reactData = $xeTable;
         const internalData = $xeTable;
+        const { treeConfig } = props;
         const { row } = params;
+        const { isRowGroupStatus } = reactData;
         const { afterFullData } = internalData;
         const checkboxOpts = $xeTable.computeCheckboxOpts;
         const { checkMethod, trigger } = checkboxOpts;
@@ -6134,7 +6475,7 @@ const Methods = {
             return;
         }
         evnt.stopPropagation();
-        if (checkboxOpts.isShiftKey && evnt.shiftKey && !props.treeConfig) {
+        if (checkboxOpts.isShiftKey && evnt.shiftKey && !(treeConfig || isRowGroupStatus)) {
             const checkboxRecords = $xeTable.getCheckboxRecords();
             if (checkboxRecords.length) {
                 const firstRow = checkboxRecords[0];
@@ -6151,7 +6492,7 @@ const Methods = {
                 }
             }
         }
-        if (!checkMethod || checkMethod({ row })) {
+        if (!checkMethod || checkMethod({ $table: $xeTable, row })) {
             $xeTable.handleBatchSelectRows([row], checked);
             $xeTable.checkSelectionStatus();
             $xeTable.dispatchEvent('checkbox-change', Object.assign({
@@ -6190,29 +6531,46 @@ const Methods = {
         const reactData = $xeTable;
         const internalData = $xeTable;
         const { treeConfig } = props;
-        const { selectCheckboxMaps, treeIndeterminateRowMaps } = internalData;
+        const { isRowGroupStatus } = reactData;
+        const { afterTreeFullData, afterGroupFullData, selectCheckboxMaps, treeIndeterminateRowMaps } = internalData;
+        const rowGroupOpts = $xeTable.computeRowGroupOpts;
         const treeOpts = $xeTable.computeTreeOpts;
-        const { transform, mapChildrenField } = treeOpts;
         const childrenField = treeOpts.children || treeOpts.childrenField;
         const checkboxOpts = $xeTable.computeCheckboxOpts;
         const { checkField, checkStrictly, checkMethod } = checkboxOpts;
-        const { afterTreeFullData } = internalData;
         if (checkStrictly) {
             return;
         }
-        // 树结构
-        if (treeConfig) {
+        if (isRowGroupStatus || treeConfig) {
             const { handleGetRowId } = createHandleGetRowId($xeTable);
             const childRowMaps = {};
             const childRowList = [];
-            XEUtils.eachTree(afterTreeFullData, (row) => {
-                const rowid = handleGetRowId(row);
-                const childList = row[transform ? mapChildrenField : childrenField];
-                if (childList && childList.length && !childRowMaps[rowid]) {
-                    childRowMaps[rowid] = 1;
-                    childRowList.unshift([row, rowid, childList]);
+            if (isRowGroupStatus) {
+                // 行分组
+                const mapChildrenField = rowGroupOpts.mapChildrenField;
+                if (mapChildrenField) {
+                    XEUtils.eachTree(afterGroupFullData, (row) => {
+                        const rowid = handleGetRowId(row);
+                        const childList = row[mapChildrenField];
+                        if (childList && childList.length && !childRowMaps[rowid]) {
+                            childRowMaps[rowid] = 1;
+                            childRowList.unshift([row, rowid, childList]);
+                        }
+                    }, { children: mapChildrenField });
                 }
-            }, { children: transform ? mapChildrenField : childrenField });
+            }
+            else if (treeConfig) {
+                // 树结构
+                const { transform, mapChildrenField } = treeOpts;
+                XEUtils.eachTree(afterTreeFullData, (row) => {
+                    const rowid = handleGetRowId(row);
+                    const childList = row[transform ? mapChildrenField : childrenField];
+                    if (childList && childList.length && !childRowMaps[rowid]) {
+                        childRowMaps[rowid] = 1;
+                        childRowList.unshift([row, rowid, childList]);
+                    }
+                }, { children: transform ? mapChildrenField : childrenField });
+            }
             childRowList.forEach(vals => {
                 const row = vals[0];
                 const rowid = vals[1];
@@ -6224,7 +6582,7 @@ const Methods = {
                     ? (item) => {
                         const childRowid = handleGetRowId(item);
                         const isSelect = checkField ? XEUtils.get(item, checkField) : selectCheckboxMaps[childRowid];
-                        if (checkMethod({ row: item })) {
+                        if (checkMethod({ $table: $xeTable, row: item })) {
                             if (isSelect) {
                                 sLen++;
                             }
@@ -6291,19 +6649,20 @@ const Methods = {
         const reactData = $xeTable;
         const internalData = $xeTable;
         const { treeConfig } = props;
-        const { afterFullData, afterTreeFullData, checkboxReserveRowMap, selectCheckboxMaps, treeIndeterminateRowMaps } = internalData;
+        const { isRowGroupStatus } = reactData;
+        const { afterFullData, afterTreeFullData, afterGroupFullData, checkboxReserveRowMap, selectCheckboxMaps, treeIndeterminateRowMaps } = internalData;
         const checkboxOpts = $xeTable.computeCheckboxOpts;
         const { checkField, checkMethod, showReserveStatus } = checkboxOpts;
         const { handleGetRowId } = createHandleGetRowId($xeTable);
         let sLen = 0; // 已选
         let hLen = 0; // 半选
         let vLen = 0; // 有效行
-        const rootList = (treeConfig ? afterTreeFullData : afterFullData);
+        const rootList = (treeConfig ? afterTreeFullData : (isRowGroupStatus ? afterGroupFullData : afterFullData));
         rootList.forEach(checkMethod
             ? row => {
                 const childRowid = handleGetRowId(row);
                 const selected = checkField ? XEUtils.get(row, checkField) : selectCheckboxMaps[childRowid];
-                if (checkMethod({ row })) {
+                if (checkMethod({ $table: $xeTable, row })) {
                     if (selected) {
                         sLen++;
                     }
@@ -6793,20 +7152,22 @@ const Methods = {
         const radioOpts = $xeTable.computeRadioOpts;
         const checkboxOpts = $xeTable.computeCheckboxOpts;
         const keyboardOpts = $xeTable.computeKeyboardOpts;
+        const rowGroupOpts = $xeTable.computeRowGroupOpts;
         const rowOpts = $xeTable.computeRowOpts;
         const columnOpts = $xeTable.computeColumnOpts;
         const currentColumnOpts = $xeTable.computeCurrentColumnOpts;
         const { actived, focused } = editStore;
         const { row, column } = params;
-        const { type, treeNode } = column;
+        const { type, treeNode, rowGroupNode } = column;
         const isRadioType = type === 'radio';
         const isCheckboxType = type === 'checkbox';
         const isExpandType = type === 'expand';
         const cell = evnt.currentTarget;
         const triggerRadio = isRadioType && getEventTargetNode(evnt, cell, 'vxe-cell--radio').flag;
         const triggerCheckbox = isCheckboxType && getEventTargetNode(evnt, cell, 'vxe-cell--checkbox').flag;
-        const triggerTreeNode = treeNode && getEventTargetNode(evnt, cell, 'vxe-tree--btn-wrapper').flag;
+        const triggerTreeNode = treeNode && getEventTargetNode(evnt, cell, 'vxe-cell--tree-btn').flag;
         const triggerExpandNode = isExpandType && getEventTargetNode(evnt, cell, 'vxe-table--expanded').flag;
+        const triggerRowGroupNode = isExpandType && getEventTargetNode(evnt, cell, 'vxe-row-group--node-btn').flag;
         params = Object.assign({ cell, triggerRadio, triggerCheckbox, triggerTreeNode, triggerExpandNode }, params);
         if (!triggerCheckbox && !triggerRadio) {
             // 如果是展开行
@@ -6817,11 +7178,15 @@ const Methods = {
             if ((treeOpts.trigger === 'row' || (treeNode && treeOpts.trigger === 'cell'))) {
                 $xeTable.triggerTreeExpandEvent(evnt, params);
             }
+            // 如果是行分组
+            if ((rowGroupOpts.trigger === 'row' || (rowGroupNode && rowGroupOpts.trigger === 'cell'))) {
+                $xeTable.triggerRowGroupExpandEvent(evnt, params);
+            }
         }
         // 如果点击了树节点
         if (!triggerTreeNode) {
-            if (!triggerExpandNode) {
-                // 如果是高亮行
+            if (!triggerExpandNode && !triggerRowGroupNode) {
+                // 如果是当前行
                 if (rowOpts.isCurrent || highlightCurrentRow) {
                     if (!triggerCheckbox && !triggerRadio) {
                         $xeTable.triggerCurrentRowEvent(evnt, params);
@@ -7033,7 +7398,7 @@ const Methods = {
         const triggerInput = cell && cell.tagName && cell.tagName.toLowerCase() === 'input';
         const triggerRadio = isRadioType && getEventTargetNode(evnt, cell, 'vxe-cell--radio').flag;
         const triggerCheckbox = isCheckboxType && getEventTargetNode(evnt, cell, 'vxe-cell--checkbox').flag;
-        const triggerTreeNode = treeNode && getEventTargetNode(evnt, cell, 'vxe-tree--btn-wrapper').flag;
+        const triggerTreeNode = treeNode && getEventTargetNode(evnt, cell, 'vxe-cell--tree-btn').flag;
         const triggerExpandNode = isExpandType && getEventTargetNode(evnt, cell, 'vxe-table--expanded').flag;
         let isColDragCell = false;
         if (rowOpts.drag) {
@@ -7307,7 +7672,7 @@ const Methods = {
             evnt.preventDefault();
             return;
         }
-        const hasCtrlKey = evnt.ctrlKey;
+        const isControlKey = hasControlKey(evnt);
         const trEl = evnt.currentTarget;
         const rowid = trEl.getAttribute('rowid') || '';
         const rest = fullAllDataRowIdData[rowid];
@@ -7319,11 +7684,11 @@ const Methods = {
             const { dragRow } = reactData;
             const offsetY = evnt.clientY - trEl.getBoundingClientRect().y;
             const dragPos = offsetY < trEl.clientHeight / 2 ? 'top' : 'bottom';
-            internalData.prevDragToChild = !!(treeConfig && transform && isToChildDrag && hasCtrlKey);
+            internalData.prevDragToChild = !!(treeConfig && transform && isToChildDrag && isControlKey);
             internalData.prevDragRow = row;
             internalData.prevDragPos = dragPos;
             if ($xeTable.eqRow(dragRow, row) ||
-                (hasCtrlKey && treeConfig && lazy && row[hasChildField] && rowRest && !rowRest.treeLoaded) ||
+                (isControlKey && treeConfig && lazy && row[hasChildField] && rowRest && !rowRest.treeLoaded) ||
                 (!isCrossDrag && treeConfig && transform && (isPeerDrag ? dragRow[parentField] !== row[parentField] : rest.level))) {
                 showDropTip($xeTable, evnt, trEl, null, false, dragPos);
                 return;
@@ -7588,7 +7953,7 @@ const Methods = {
             evnt.preventDefault();
             return;
         }
-        const hasCtrlKey = evnt.ctrlKey;
+        const isControlKey = hasControlKey(evnt);
         const thEl = evnt.currentTarget;
         const colid = thEl.getAttribute('colid');
         const column = $xeTable.getColumnById(colid);
@@ -7597,7 +7962,7 @@ const Methods = {
             const { clientX } = evnt;
             const offsetX = clientX - thEl.getBoundingClientRect().x;
             const dragPos = offsetX < thEl.clientWidth / 2 ? 'left' : 'right';
-            internalData.prevDragToChild = !!((isCrossDrag && isToChildDrag) && hasCtrlKey);
+            internalData.prevDragToChild = !!((isCrossDrag && isToChildDrag) && isControlKey);
             internalData.prevDragCol = column;
             internalData.prevDragPos = dragPos;
             if (column.fixed ||
@@ -8001,7 +8366,7 @@ const Methods = {
         const $xeTable = this;
         const reactData = $xeTable;
         const internalData = $xeTable;
-        const { expandColumn: column } = reactData;
+        const { expandColumn } = reactData;
         const { rowExpandLazyLoadedMaps } = internalData;
         const expandOpts = $xeTable.computeExpandOpts;
         const { row } = params;
@@ -8013,12 +8378,12 @@ const Methods = {
         const rowid = getRowid($xeTable, row);
         if (!lazy || !rowExpandLazyLoadedMaps[rowid]) {
             const expanded = !$xeTable.isRowExpandByRow(row);
-            const columnIndex = $xeTable.getColumnIndex(column);
-            const $columnIndex = $xeTable.getVMColumnIndex(column);
+            const columnIndex = expandColumn ? $xeTable.getColumnIndex(expandColumn) : -1;
+            const $columnIndex = expandColumn ? $xeTable.getVMColumnIndex(expandColumn) : -1;
             $xeTable.setRowExpand(row, expanded);
             $xeTable.dispatchEvent('toggle-row-expand', {
                 expanded,
-                column,
+                column: expandColumn,
                 columnIndex,
                 $columnIndex,
                 row,
@@ -8068,8 +8433,8 @@ const Methods = {
         const expandOpts = $xeTable.computeExpandOpts;
         const { reserve, lazy, accordion, toggleMethod } = expandOpts;
         const lazyRests = [];
-        const columnIndex = $xeTable.getColumnIndex(expandColumn);
-        const $columnIndex = $xeTable.getVMColumnIndex(expandColumn);
+        const columnIndex = expandColumn ? $xeTable.getColumnIndex(expandColumn) : -1;
+        const $columnIndex = expandColumn ? $xeTable.getVMColumnIndex(expandColumn) : -1;
         if (rows) {
             if (!XEUtils.isArray(rows)) {
                 rows = [rows];
@@ -8181,6 +8546,88 @@ const Methods = {
         });
         return rest;
     },
+    setRowGroups(fieldOrColumns) {
+        const $xeTable = this;
+        const props = $xeTable;
+        const internalData = $xeTable;
+        const { rowGroupConfig } = props;
+        if (!rowGroupConfig) {
+            errLog('vxe.error.reqProp', ['row-group-config']);
+            return $xeTable.$nextTick();
+        }
+        if (fieldOrColumns) {
+            handleUpdateRowGroup($xeTable, (XEUtils.isArray(fieldOrColumns) ? fieldOrColumns : [fieldOrColumns]).map(fieldOrColumn => {
+                return XEUtils.isString(fieldOrColumn) ? fieldOrColumn : fieldOrColumn.field;
+            }));
+            return loadTableData($xeTable, internalData.tableSynchData, true);
+        }
+        return $xeTable.$nextTick();
+    },
+    clearRowGroups() {
+        const $xeTable = this;
+        const props = $xeTable;
+        const internalData = $xeTable;
+        const { rowGroupConfig } = props;
+        if (!rowGroupConfig) {
+            errLog('vxe.error.reqProp', ['row-group-config']);
+            return $xeTable.$nextTick();
+        }
+        handleUpdateRowGroup($xeTable, []);
+        return loadTableData($xeTable, internalData.tableSynchData, true);
+    },
+    isRowGroupRecord(row) {
+        const $xeTable = this;
+        const reactData = $xeTable;
+        const { isRowGroupStatus } = reactData;
+        return isRowGroupStatus && row.isAggregate;
+    },
+    isRowGroupExpandByRow(row) {
+        const $xeTable = this;
+        const reactData = $xeTable;
+        const internalData = $xeTable;
+        const { rowGroupExpandedFlag } = reactData;
+        const { rowGroupExpandedMaps } = internalData;
+        return !!rowGroupExpandedFlag && !!rowGroupExpandedMaps[getRowid($xeTable, row)];
+    },
+    setRowGroupExpand(rows, expanded) {
+        const $xeTable = this;
+        if (rows) {
+            if (!XEUtils.isArray(rows)) {
+                rows = [rows];
+            }
+            return handleRowGroupVirtualExpand($xeTable, rows, expanded);
+        }
+        return $xeTable.$nextTick();
+    },
+    setAllRowGroupExpand(expanded) {
+        const $xeTable = this;
+        const reactData = $xeTable;
+        const internalData = $xeTable;
+        const { tableFullGroupData } = internalData;
+        const rowGroupOpts = $xeTable.computeRowGroupOpts;
+        const { mapChildrenField } = rowGroupOpts;
+        const rgExpandedMaps = {};
+        if (expanded && mapChildrenField) {
+            XEUtils.eachTree(tableFullGroupData, (row) => {
+                if (row[mapChildrenField] && row[mapChildrenField].length) {
+                    rgExpandedMaps[getRowid($xeTable, row)] = row;
+                }
+            }, { children: mapChildrenField });
+        }
+        internalData.rowGroupExpandedMaps = rgExpandedMaps;
+        handleVirtualTreeToList($xeTable);
+        reactData.rowGroupExpandedFlag++;
+        return $xeTable.handleTableData();
+    },
+    clearRowGroupExpand() {
+        const $xeTable = this;
+        const reactData = $xeTable;
+        const internalData = $xeTable;
+        internalData.rowGroupExpandedMaps = {};
+        handleVirtualTreeToList($xeTable);
+        reactData.rowGroupExpandedFlag++;
+        return $xeTable.handleTableData();
+    },
     getTreeExpandRecords() {
         const $xeTable = this;
         const internalData = $xeTable;
@@ -8242,11 +8689,11 @@ const Methods = {
             });
         }
         internalData.treeExpandedMaps = {};
-        reactData.treeExpandedFlag++;
         if (transform) {
             handleVirtualTreeToList($xeTable);
-            return $xeTable.handleTableData();
+            $xeTable.handleTableData();
         }
+        reactData.treeExpandedFlag++;
         return $xeTable.$nextTick();
     },
     /**
@@ -8255,6 +8702,7 @@ const Methods = {
      */
     reloadTreeExpand(row) {
         const $xeTable = this;
+        const reactData = $xeTable;
         const internalData = $xeTable;
         const { treeExpandLazyLoadedMaps } = internalData;
         const treeOpts = $xeTable.computeTreeOpts;
@@ -8267,8 +8715,9 @@ const Methods = {
             }).then(() => {
                 if (transform) {
                     handleVirtualTreeToList($xeTable);
-                    return $xeTable.handleTableData();
+                    $xeTable.handleTableData();
                 }
+                reactData.treeExpandedFlag++;
             }).then(() => {
                 return $xeTable.recalculate();
             });
@@ -8283,6 +8732,27 @@ const Methods = {
         // 即将废弃
         return $xeTable.reloadTreeExpand(row);
     },
+    /**
+     * 行分组事件
+     */
+    triggerRowGroupExpandEvent(evnt, params) {
+        const $xeTable = this;
+        const internalData = $xeTable;
+        const { rowGroupExpandedMaps } = internalData;
+        const rowGroupOpts = $xeTable.computeRowGroupOpts;
+        const { row, column } = params;
+        const { trigger } = rowGroupOpts;
+        if (trigger === 'manual') {
+            return;
+        }
+        evnt.stopPropagation();
+        const rowid = getRowid($xeTable, row);
+        const expanded = !rowGroupExpandedMaps[rowid];
+        const columnIndex = $xeTable.getColumnIndex(column);
+        const $columnIndex = $xeTable.getVMColumnIndex(column);
+        $xeTable.setRowGroupExpand(row, expanded);
+        $xeTable.dispatchEvent('toggle-row-group-expand', { expanded, column, columnIndex, $columnIndex, row }, evnt);
+    },
     /**
      * 展开树节点事件
      */
@@ -8327,8 +8797,12 @@ const Methods = {
      * @param {Boolean} expanded 是否展开
      */
     setAllTreeExpand(expanded) {
-        const { tableFullData, treeOpts } = this;
-        const { lazy } = treeOpts;
+        const $xeTable = this;
+        const reactData = $xeTable;
+        const internalData = $xeTable;
+        const { tableFullData } = internalData;
+        const treeOpts = $xeTable.computeTreeOpts;
+        const { transform, lazy } = treeOpts;
         const childrenField = treeOpts.children || treeOpts.childrenField;
         const expandeds = [];
         XEUtils.eachTree(tableFullData, (row) => {
@@ -8337,7 +8811,13 @@ const Methods = {
                 expandeds.push(row);
             }
         }, { children: childrenField });
-        return this.setTreeExpand(expandeds, expanded);
+        return $xeTable.setTreeExpand(expandeds, expanded).then(() => {
+            if (transform) {
+                handleVirtualTreeToList($xeTable);
+                reactData.treeExpandedFlag++;
+                return $xeTable.recalculate();
+            }
+        });
     },
     /**
      * 设置展开树形节点，二个参数设置这一行展开与否
@@ -8391,15 +8871,15 @@ const Methods = {
         const { transform, reserve } = treeOpts;
         const expList = $xeTable.getTreeExpandRecords();
         internalData.treeExpandedMaps = {};
-        reactData.treeExpandedFlag++;
         if (reserve) {
             XEUtils.eachTree(tableFullTreeData, row => handleTreeExpandReserve($xeTable, row, false), { children: childrenField });
         }
         return $xeTable.handleTableData().then(() => {
             if (transform) {
                 handleVirtualTreeToList($xeTable);
-                return $xeTable.handleTableData();
+                $xeTable.handleTableData();
             }
+            reactData.treeExpandedFlag++;
         }).then(() => {
             if (expList.length) {
                 $xeTable.recalculate();
@@ -9184,21 +9664,29 @@ const Methods = {
      * @param {Row} row 行对象
      */
     scrollToTreeRow(row) {
-        const { tableFullData, treeConfig, treeOpts } = this;
-        const childrenField = treeOpts.children || treeOpts.childrenField;
+        const $xeTable = this;
+        const props = $xeTable;
+        const reactData = $xeTable;
+        const internalData = $xeTable;
+        const { treeConfig } = props;
+        const { isRowGroupStatus } = reactData;
+        const { tableFullData } = internalData;
         const rests = [];
-        if (treeConfig) {
-            const matchObj = XEUtils.findTree(tableFullData, item => item === row, { children: childrenField });
+        if (treeConfig || isRowGroupStatus) {
+            const rowGroupOpts = $xeTable.computeRowGroupOpts;
+            const treeOpts = $xeTable.computeTreeOpts;
+            const childrenField = treeOpts.children || treeOpts.childrenField;
+            const matchObj = XEUtils.findTree(tableFullData, item => $xeTable.eqRow(item, row), { children: isRowGroupStatus ? rowGroupOpts.mapChildrenField : childrenField });
             if (matchObj) {
                 const nodes = matchObj.nodes;
                 nodes.forEach((row, index) => {
-                    if (index < nodes.length - 1 && !this.isTreeExpandByRow(row)) {
-                        rests.push(this.setTreeExpand(row, true));
+                    if (index < nodes.length - 1 && !$xeTable.isTreeExpandByRow(row)) {
+                        rests.push($xeTable.setTreeExpand(row, true));
                     }
                 });
             }
         }
-        return Promise.all(rests).then(() => rowToVisible(this, row));
+        return Promise.all(rests).then(() => rowToVisible($xeTable, row));
     },
     /**
      * 手动清除滚动相关信息，还原到初始状态