vxe-table 3.14.0-beta.9 → 3.14.1

package/es/table/module/custom/panel.js

@@ -89,6 +89,7 @@ const renderSimplePanel = (h, _vm) => {
     const props = _vm;
     const $xeTable = _vm.$xeTable;
     const reactData = $xeTable;
+    const $xeGrid = $xeTable.$xeGrid;
     const { customStore } = props;
     const { isCustomStatus, customColumnList } = reactData;
     const customOpts = $xeTable.computeCustomOpts;
@@ -115,7 +116,7 @@ const renderSimplePanel = (h, _vm) => {
     }
     const params = {
         $table: $xeTable,
-        $grid: $xeTable.xegrid,
+        $grid: $xeGrid,
         columns: customColumnList,
         isAllChecked,
         isAllIndeterminate,
@@ -253,7 +254,7 @@ const renderSimplePanel = (h, _vm) => {
         class: ['vxe-table-custom-wrapper', `placement--${placement}`, {
                 'is--active': customStore.visible
             }],
-        style: maxHeight && !['left', 'right'].includes(placement)
+        style: maxHeight && !['left', 'right'].includes(placement || '')
             ? {
                 maxHeight: `${maxHeight}px`
             }
@@ -391,6 +392,7 @@ const renderPopupPanel = (h, _vm) => {
     const $xeTable = _vm.$xeTable;
     const tableProps = $xeTable;
     const reactData = $xeTable;
+    const $xeGrid = $xeTable.$xeGrid;
     const { customStore } = props;
     const { resizable: allResizable } = tableProps;
     const { isCustomStatus, customColumnList } = reactData;
@@ -417,7 +419,7 @@ const renderPopupPanel = (h, _vm) => {
     const isAllIndeterminate = customStore.isIndeterminate;
     const params = {
         $table: $xeTable,
-        $grid: $xeTable.xegrid,
+        $grid: $xeGrid,
         columns: customColumnList,
         isAllChecked,
         isAllIndeterminate,
@@ -802,9 +804,6 @@ export default {
     inject: {
         $xeTable: {
             default: null
-        },
-        $xetable: {
-            default: null
         }
     },
     data() {
@@ -822,8 +821,8 @@ export default {
         const VxeUINumberInputComponent = VxeUI.getComponent('VxeNumberInput');
         const VxeUIRadioGroupComponent = VxeUI.getComponent('VxeRadioGroup');
         this.$nextTick(() => {
-            const { $xetable } = this;
-            const { customOpts } = $xetable;
+            const $xeTable = this.$xeTable;
+            const { customOpts } = $xeTable;
             const { mode } = customOpts;
             if (!VxeUIModalComponent) {
                 errLog('vxe.error.reqComp', ['vxe-modal']);
@@ -852,16 +851,18 @@ export default {
     },
     methods: {
         handleWrapperMouseenterEvent(evnt) {
-            const { $xetable, customStore } = this;
+            const $xeTable = this.$xeTable;
+            const { customStore } = this;
             customStore.activeWrapper = true;
-            $xetable.customOpenEvent(evnt);
+            $xeTable.customOpenEvent(evnt);
         },
         handleWrapperMouseleaveEvent(evnt) {
-            const { $xetable, customStore } = this;
+            const $xeTable = this.$xeTable;
+            const { customStore } = this;
             customStore.activeWrapper = false;
             setTimeout(() => {
                 if (!customStore.activeBtn && !customStore.activeWrapper) {
-                    $xetable.customCloseEvent(evnt);
+                    $xeTable.customCloseEvent(evnt);
                 }
             }, 300);
         },
@@ -888,10 +889,10 @@ export default {
             $xeTable.emitCustomEvent('cancel', $event);
         },
         handleResetCustomEvent(evnt) {
-            const { $xetable } = this;
-            $xetable.resetCustom(true);
-            $xetable.closeCustom();
-            $xetable.emitCustomEvent('reset', evnt);
+            const $xeTable = this.$xeTable;
+            $xeTable.resetCustom(true);
+            $xeTable.closeCustom();
+            $xeTable.emitCustomEvent('reset', evnt);
         },
         resetCustomEvent(evnt) {
             if (VxeUI.modal) {
@@ -964,7 +965,7 @@ export default {
             $xeTable.checkCustomStatus();
         },
         changeColumnWidth(column) {
-            const $xeTable = this.$xetable;
+            const $xeTable = this.$xeTable;
             const reactData = $xeTable;
             const customOpts = $xeTable.computeCustomOpts;
             if (customOpts.immediate) {
@@ -978,7 +979,7 @@ export default {
             }
         },
         changeFixedOption(column, colFixed) {
-            const $xeTable = this.$xetable;
+            const $xeTable = this.$xeTable;
             const reactData = $xeTable;
             const isMaxFixedColumn = $xeTable.computeIsMaxFixedColumn;
             const customOpts = $xeTable.computeCustomOpts;
@@ -1017,11 +1018,11 @@ export default {
             }
         },
         allOptionEvent() {
-            const { $xetable } = this;
-            $xetable.toggleCustomAllCheckbox();
+            const $xeTable = this.$xeTable;
+            $xeTable.toggleCustomAllCheckbox();
         },
         sortMousedownEvent(evnt) {
-            const $xeTable = this.$xetable;
+            const $xeTable = this.$xeTable;
             const btnEl = evnt.currentTarget;
             const cellEl = btnEl.parentElement;
             const tdEl = cellEl.parentElement;
@@ -1048,7 +1049,7 @@ export default {
             }
         },
         sortDragendEvent(evnt) {
-            const $xeTable = this.$xetable;
+            const $xeTable = this.$xeTable;
             const tableProps = $xeTable;
             const reactData = $xeTable;
             const internalData = $xeTable;
@@ -1222,7 +1223,7 @@ export default {
             removeClass(trEl, 'active--drag-origin');
         },
         sortDragoverEvent(evnt) {
-            const $xeTable = this.$xetable;
+            const $xeTable = this.$xeTable;
             const { dragCol } = this;
             const customOpts = $xeTable.computeCustomOpts;
             const { immediate } = customOpts;

package/es/table/module/edit/mixin.js

@@ -44,18 +44,20 @@ function syncActivedCell($xeTable) {
         }
     }
 }
-function insertTreeRow(_vm, newRecords, isAppend) {
-    const { tableFullTreeData, afterFullData, fullDataRowIdData, fullAllDataRowIdData, treeOpts } = _vm;
+function insertTreeRow($xeTable, newRecords, isAppend) {
+    const internalData = $xeTable;
+    const { tableFullTreeData, afterFullData, fullDataRowIdData, fullAllDataRowIdData } = internalData;
+    const treeOpts = $xeTable.computeTreeOpts;
     const { rowField, parentField, mapChildrenField } = treeOpts;
     const childrenField = treeOpts.children || treeOpts.childrenField;
     const funcName = isAppend ? 'push' : 'unshift';
     newRecords.forEach((item) => {
         const parentRowId = item[parentField];
-        const rowid = getRowid(_vm, item);
+        const rowid = getRowid($xeTable, item);
         const matchObj = parentRowId ? XEUtils.findTree(tableFullTreeData, (item) => parentRowId === item[rowField], { children: mapChildrenField }) : null;
         if (matchObj) {
             const { item: parentRow } = matchObj;
-            const parentRest = fullAllDataRowIdData[getRowid(_vm, parentRow)];
+            const parentRest = fullAllDataRowIdData[getRowid($xeTable, parentRow)];
             const parentLevel = parentRest ? parentRest.level : 0;
             let parentChilds = parentRow[childrenField];
             let mapChilds = parentRow[mapChildrenField];
@@ -90,8 +92,8 @@ function handleInsertRowAt($xeTable, records, targetRow, isInsertNextRow) {
     const reactData = $xeTable;
     const internalData = $xeTable;
     const { treeConfig } = props;
-    const { mergeList, editStore } = reactData;
-    const { tableFullTreeData, afterFullData, tableFullData, fullDataRowIdData, fullAllDataRowIdData } = internalData;
+    const { mergeList } = reactData;
+    const { tableFullTreeData, afterFullData, tableFullData, fullDataRowIdData, fullAllDataRowIdData, insertRowMaps } = internalData;
     const treeOpts = $xeTable.computeTreeOpts;
     const { transform, rowField, mapChildrenField } = treeOpts;
     const childrenField = treeOpts.children || treeOpts.childrenField;
@@ -238,11 +240,11 @@ function handleInsertRowAt($xeTable, records, targetRow, isInsertNextRow) {
             }
         }
     }
-    const { insertMaps } = editStore;
     newRecords.forEach(newRow => {
         const rowid = getRowid($xeTable, newRow);
-        insertMaps[rowid] = newRow;
+        insertRowMaps[rowid] = newRow;
     });
+    reactData.insertRowFlag++;
     $xeTable.cacheRowMap(false);
     $xeTable.updateScrollYStatus();
     $xeTable.handleTableData(treeConfig && transform);
@@ -251,7 +253,7 @@ function handleInsertRowAt($xeTable, records, targetRow, isInsertNextRow) {
     }
     $xeTable.updateFooter();
     $xeTable.checkSelectionStatus();
-    if ($xeTable.scrollYLoad) {
+    if (reactData.scrollYLoad) {
         $xeTable.updateScrollYSpace();
     }
     return $xeTable.$nextTick().then(() => {
@@ -318,6 +320,7 @@ function handleClearEdit($xeTable, evnt, targetRow) {
 function handleEditActive($xeTable, params, evnt, isFocus, isPos) {
     const props = $xeTable;
     const reactData = $xeTable;
+    const $xeGrid = $xeTable.$xeGrid;
     const { editConfig, mouseConfig } = props;
     const { editStore, tableColumn } = reactData;
     const editOpts = $xeTable.computeEditOpts;
@@ -334,7 +337,7 @@ function handleEditActive($xeTable, params, evnt, isFocus, isPos) {
             if (actived.row !== row || (mode === 'cell' ? actived.column !== column : false)) {
                 // 判断是否禁用编辑
                 let type = 'edit-disabled';
-                if (!beforeEditMethod || beforeEditMethod(Object.assign(Object.assign({}, params), { $table: $xeTable, $grid: $xeTable.xegrid }))) {
+                if (!beforeEditMethod || beforeEditMethod(Object.assign(Object.assign({}, params), { $table: $xeTable, $grid: $xeGrid }))) {
                     if (mouseConfig) {
                         $xeTable.clearSelected();
                         if ($xeTable.clearCellAreas) {
@@ -363,7 +366,7 @@ function handleEditActive($xeTable, params, evnt, isFocus, isPos) {
                             $xeTable.handleFocus(params, evnt);
                         }
                         if (afterEditMethod) {
-                            afterEditMethod(Object.assign(Object.assign({}, params), { $table: $xeTable, $grid: $xeTable.xegrid }));
+                            afterEditMethod(Object.assign(Object.assign({}, params), { $table: $xeTable, $grid: $xeGrid }));
                         }
                     });
                 }
@@ -491,13 +494,13 @@ export default {
             const reactData = $xeTable;
             const internalData = $xeTable;
             const { treeConfig } = props;
-            const { mergeList, editStore, selectCheckboxMaps } = reactData;
-            const { tableFullTreeData, afterFullData, tableFullData } = internalData;
+            const { mergeList, editStore } = reactData;
+            const { tableFullTreeData, selectCheckboxMaps, afterFullData, tableFullData, pendingRowMaps, insertRowMaps, removeRowMaps } = internalData;
             const checkboxOpts = $xeTable.computeCheckboxOpts;
             const treeOpts = $xeTable.computeTreeOpts;
             const { transform, mapChildrenField } = treeOpts;
             const childrenField = treeOpts.children || treeOpts.childrenField;
-            const { actived, removeMaps, insertMaps } = editStore;
+            const { actived } = editStore;
             const { checkField } = checkboxOpts;
             let delList = [];
             if (!rows) {
@@ -510,19 +513,18 @@ export default {
             rows.forEach(row => {
                 if (!$xeTable.isInsertByRow(row)) {
                     const rowid = getRowid($xeTable, row);
-                    removeMaps[rowid] = row;
+                    removeRowMaps[rowid] = row;
                 }
             });
             // 如果绑定了多选属性，则更新状态
             if (!checkField) {
-                const selectRowMaps = Object.assign({}, selectCheckboxMaps);
                 rows.forEach((row) => {
                     const rowid = getRowid(this, row);
-                    if (selectRowMaps[rowid]) {
-                        delete selectRowMaps[rowid];
+                    if (selectCheckboxMaps[rowid]) {
+                        delete selectCheckboxMaps[rowid];
                     }
                 });
-                this.selectCheckboxMaps = selectRowMaps;
+                reactData.updateCheckboxFlag++;
             }
             // 从数据源中移除
             if (tableFullData === rows) {
@@ -582,10 +584,16 @@ export default {
             // 从新增中移除已删除的数据
             rows.forEach((row) => {
                 const rowid = getRowid($xeTable, row);
-                if (insertMaps[rowid]) {
-                    delete insertMaps[rowid];
+                if (insertRowMaps[rowid]) {
+                    delete insertRowMaps[rowid];
+                }
+                if (pendingRowMaps[rowid]) {
+                    delete pendingRowMaps[rowid];
                 }
             });
+            reactData.removeRowFlag++;
+            reactData.insertRowFlag++;
+            reactData.pendingRowFlag++;
             $xeTable.updateFooter();
             $xeTable.cacheRowMap(false);
             $xeTable.handleTableData(treeConfig && transform);
@@ -655,13 +663,10 @@ export default {
          */
         _getInsertRecords() {
             const $xeTable = this;
-            const reactData = $xeTable;
             const internalData = $xeTable;
-            const { editStore } = reactData;
-            const { fullAllDataRowIdData } = internalData;
-            const { insertMaps } = editStore;
+            const { fullAllDataRowIdData, insertRowMaps } = internalData;
             const insertRecords = [];
-            XEUtils.each(insertMaps, (row, rowid) => {
+            XEUtils.each(insertRowMaps, (row, rowid) => {
                 if (fullAllDataRowIdData[rowid]) {
                     insertRecords.push(row);
                 }
@@ -673,11 +678,10 @@ export default {
          */
         _getRemoveRecords() {
             const $xeTable = this;
-            const reactData = $xeTable;
-            const { editStore } = reactData;
-            const { removeMaps } = editStore;
+            const internalData = $xeTable;
+            const { removeRowMaps } = internalData;
             const removeRecords = [];
-            XEUtils.each(removeMaps, (row) => {
+            XEUtils.each(removeRowMaps, (row) => {
                 removeRecords.push(row);
             });
             return removeRecords;
@@ -689,17 +693,17 @@ export default {
          */
         _getUpdateRecords() {
             const $xeTable = this;
-            const { keepSource, tableFullData, isUpdateByRow, treeConfig, treeOpts, editStore } = this;
+            const props = $xeTable;
+            const internalData = $xeTable;
+            const { keepSource, treeConfig } = props;
+            const { tableFullData } = internalData;
+            const treeOpts = $xeTable.computeTreeOpts;
             if (keepSource) {
-                const { actived } = editStore;
-                const { row, column } = actived;
-                if (row || column) {
-                    syncActivedCell($xeTable);
-                }
+                syncActivedCell($xeTable);
                 if (treeConfig) {
-                    return XEUtils.filterTree(tableFullData, row => isUpdateByRow(row), treeOpts);
+                    return XEUtils.filterTree(tableFullData, row => $xeTable.isUpdateByRow(row), treeOpts);
                 }
-                return tableFullData.filter((row) => isUpdateByRow(row));
+                return tableFullData.filter((row) => $xeTable.isUpdateByRow(row));
             }
             return [];
         },
@@ -748,42 +752,52 @@ export default {
             return handleClearEdit($xeTable, evnt, targetRow);
         },
         _getActiveRecord() {
+            const $xeTable = this;
             if (process.env.NODE_ENV === 'development') {
                 warnLog('vxe.error.delFunc', ['getActiveRecord', 'getEditRecord']);
             }
             // 即将废弃
-            return this.getEditRecord();
+            return $xeTable.getEditRecord();
         },
         _getEditRecord() {
-            const { $el, editStore, afterFullData } = this;
-            const { actived } = editStore;
-            const { args, row } = actived;
-            if (args && this.findRowIndexOf(afterFullData, row) > -1 && $el.querySelectorAll('.vxe-body--column.col--active').length) {
+            const $xeTable = this;
+            const reactData = $xeTable;
+            const internalData = $xeTable;
+            const { editStore } = reactData;
+            const { afterFullData } = internalData;
+            const el = $xeTable.$refs.refElem;
+            const { args, row } = editStore.actived;
+            if (args && $xeTable.findRowIndexOf(afterFullData, row) > -1 && el.querySelectorAll('.vxe-body--column.col--active').length) {
                 return Object.assign({}, args);
             }
             return null;
         },
         _isActiveByRow(row) {
+            const $xeTable = this;
             if (process.env.NODE_ENV === 'development') {
                 warnLog('vxe.error.delFunc', ['isActiveByRow', 'isEditByRow']);
             }
             // 即将废弃
-            return this.isEditByRow(row);
+            return $xeTable.isEditByRow(row);
         },
         /**
          * 判断行是否为激活编辑状态
          * @param {Row} row 行对象
          */
         _isEditByRow(row) {
-            return this.editStore.actived.row === row;
+            const $xeTable = this;
+            const reactData = $xeTable;
+            const { editStore } = reactData;
+            return editStore.actived.row === row;
         },
         /**
          * 处理聚焦
          */
         handleFocus(params) {
-            const { editOpts } = this;
+            const $xeTable = this;
             const { row, column, cell } = params;
             const { editRender } = column;
+            const editOpts = $xeTable.computeEditOpts;
             if (isEnableConf(editRender)) {
                 const compRender = renderer.get(editRender.name);
                 let autoFocus = editRender.autofocus || editRender.autoFocus;
@@ -799,7 +813,7 @@ export default {
                     }
                     // 如果指定了聚焦 class
                     if (XEUtils.isFunction(autoFocus)) {
-                        inputElem = autoFocus.call(this, params);
+                        inputElem = autoFocus.call($xeTable, params);
                     }
                     else if (autoFocus) {
                         if (autoFocus === true) {
@@ -832,18 +846,19 @@ export default {
                     if (editOpts.autoPos) {
                         if (!column.fixed) {
                             // 显示到可视区中
-                            this.scrollToRow(row, column);
+                            $xeTable.scrollToRow(row, column);
                         }
                     }
                 }
             }
         },
         _setActiveRow(row) {
+            const $xeTable = this;
             if (process.env.NODE_ENV === 'development') {
                 warnLog('vxe.error.delFunc', ['setActiveRow', 'setEditRow']);
             }
             // 即将废弃
-            return this.setEditRow(row);
+            return $xeTable.setEditRow(row);
         },
         /**
          * 激活行编辑
@@ -855,7 +870,7 @@ export default {
             if (fieldOrColumn) {
                 isPos = true;
                 if (fieldOrColumn !== true) {
-                    column = XEUtils.isString(fieldOrColumn) ? this.getColumnByField(fieldOrColumn) : fieldOrColumn;
+                    column = XEUtils.isString(fieldOrColumn) ? $xeTable.getColumnByField(fieldOrColumn) : fieldOrColumn;
                 }
             }
             return handleEditCell($xeTable, row, column, isPos);
@@ -878,24 +893,38 @@ export default {
          * 只对 trigger=dblclick 有效，选中单元格
          */
         _setSelectCell(row, fieldOrColumn) {
-            const { tableData, editOpts, visibleColumn } = this;
-            const column = XEUtils.isString(fieldOrColumn) ? this.getColumnByField(fieldOrColumn) : fieldOrColumn;
+            const $xeTable = this;
+            const reactData = $xeTable;
+            const { tableData } = reactData;
+            const editOpts = $xeTable.computeEditOpts;
+            const column = XEUtils.isString(fieldOrColumn) ? $xeTable.getColumnByField(fieldOrColumn) : fieldOrColumn;
             if (row && column && editOpts.trigger !== 'manual') {
-                const rowIndex = this.findRowIndexOf(tableData, row);
+                const rowIndex = $xeTable.findRowIndexOf(tableData, row);
                 if (rowIndex > -1) {
-                    const cell = this.getCellElement(row, column);
-                    const params = { row, rowIndex, column, columnIndex: visibleColumn.indexOf(column), cell };
-                    this.handleSelected(params, {});
+                    const cell = $xeTable.getCellElement(row, column);
+                    const params = {
+                        row,
+                        rowIndex,
+                        column,
+                        columnIndex: $xeTable.getColumnIndex(column),
+                        cell
+                    };
+                    $xeTable.handleSelected(params, {});
                 }
             }
-            return this.$nextTick();
+            return $xeTable.$nextTick();
         },
         /**
          * 处理选中源
          */
         handleSelected(params, evnt) {
             const $xeTable = this;
-            const { mouseConfig, mouseOpts, editOpts, editStore } = this;
+            const props = $xeTable;
+            const reactData = $xeTable;
+            const { mouseConfig } = props;
+            const { editStore } = reactData;
+            const mouseOpts = $xeTable.computeMouseOpts;
+            const editOpts = $xeTable.computeEditOpts;
             const { actived, selected } = editStore;
             const { row, column } = params;
             const isMouseSelected = mouseConfig && mouseOpts.selected;
@@ -903,22 +932,24 @@ export default {
                 if (isMouseSelected && (selected.row !== row || selected.column !== column)) {
                     if (actived.row !== row || (editOpts.mode === 'cell' ? actived.column !== column : false)) {
                         handleClearEdit($xeTable, evnt);
-                        this.clearSelected(evnt);
-                        this.clearCellAreas(evnt);
-                        this.clearCopyCellArea(evnt);
+                        $xeTable.clearSelected();
+                        if ($xeTable.clearCellAreas) {
+                            $xeTable.clearCellAreas();
+                            $xeTable.clearCopyCellArea();
+                        }
                         selected.args = params;
                         selected.row = row;
                         selected.column = column;
                         if (isMouseSelected) {
                             this.addCellSelectedClass();
                         }
-                        this.focus();
+                        $xeTable.focus();
                         if (evnt) {
-                            this.emitEvent('cell-selected', params, evnt);
+                            $xeTable.dispatchEvent('cell-selected', params, evnt);
                         }
                     }
                 }
-                return this.$nextTick();
+                return $xeTable.$nextTick();
             };
             return selectMethod();
         },
@@ -926,7 +957,10 @@ export default {
          * 获取选中的单元格
          */
         _getSelectedCell() {
-            const { args, column } = this.editStore.selected;
+            const $xeTable = this;
+            const reactData = $xeTable;
+            const { editStore } = reactData;
+            const { args, column } = editStore.selected;
             if (args && column) {
                 return Object.assign({}, args);
             }
@@ -937,12 +971,13 @@ export default {
          */
         _clearSelected() {
             const $xeTable = this;
-            const { selected } = this.editStore;
+            const reactData = $xeTable;
+            const { editStore } = reactData;
+            const { selected } = editStore;
             selected.row = null;
             selected.column = null;
-            this.reColTitleSdCls();
             removeCellSelectedClass($xeTable);
-            return this.$nextTick();
+            return $xeTable.$nextTick();
         },
         reColTitleSdCls() {
             const headerElem = this.elemStore['main-header-list'];

package/es/table/module/export/export-panel.js

@@ -78,6 +78,7 @@ export default {
     },
     render(h) {
         const $xeTable = this.$xeTable;
+        const $xeGrid = $xeTable.$xeGrid;
         const { _e, checkedAll, isAll: isAllChecked, isIndeterminate: isAllIndeterminate, showSheet, supportMerge, supportStyle, defaultOptions, storeData } = this;
         const { hasTree, hasMerge, isPrint, hasColgroup, columns } = storeData;
         const { isHeader } = defaultOptions;
@@ -158,7 +159,7 @@ export default {
                 default: () => {
                     const params = {
                         $table: $xeTable,
-                        $grid: $xeTable.xegrid,
+                        $grid: $xeGrid,
                         options: defaultOptions,
                         columns,
                         params: defaultOptions.params
@@ -426,7 +427,7 @@ export default {
                 footer: () => {
                     const params = {
                         $table: $xeTable,
-                        $grid: $xeTable.xegrid,
+                        $grid: $xeGrid,
                         options: defaultOptions,
                         columns,
                         params: defaultOptions.params
@@ -531,9 +532,9 @@ export default {
             }
         },
         printEvent() {
-            const $xetable = this.$parent;
+            const $xeTable = this.$parent;
             this.storeData.visible = false;
-            $xetable.print(Object.assign({}, $xetable.printOpts, this.getExportOption()));
+            $xeTable.print(Object.assign({}, $xeTable.printOpts, this.getExportOption()));
         },
         exportEvent() {
             const $xeTable = this.$xeTable;

package/es/table/module/export/import-panel.js

@@ -61,7 +61,8 @@ export default {
         });
     },
     render(h) {
-        const $xeTable = this.$xeTable;
+        const $xeTable = this.$parent;
+        const $xeGrid = $xeTable.$xeGrid;
         const { hasFile, loading, parseTypeLabel, defaultOptions, storeData, selectName } = this;
         const slots = defaultOptions.slots || {};
         const topSlot = slots.top;
@@ -96,7 +97,7 @@ export default {
                 default: () => {
                     const params = {
                         $table: $xeTable,
-                        $grid: $xeTable.xegrid,
+                        $grid: $xeGrid,
                         options: defaultOptions,
                         params: defaultOptions.params
                     };
@@ -185,7 +186,7 @@ export default {
                 footer: () => {
                     const params = {
                         $table: $xeTable,
-                        $grid: $xeTable.xegrid,
+                        $grid: $xeGrid,
                         options: defaultOptions,
                         params: defaultOptions.params
                     };
@@ -226,8 +227,8 @@ export default {
             });
         },
         selectFileEvent() {
-            const $xetable = this.$parent;
-            $xetable.readFile(this.defaultOptions).then((params) => {
+            const $xeTable = this.$parent;
+            $xeTable.readFile(this.defaultOptions).then((params) => {
                 const { file } = params;
                 Object.assign(this.storeData, parseFile(file), { file });
             }).catch((e) => e);
@@ -245,9 +246,9 @@ export default {
             this.storeData.visible = false;
         },
         importEvent() {
-            const $xetable = this.$parent;
+            const $xeTable = this.$parent;
             this.loading = true;
-            $xetable.importByFile(this.storeData.file, Object.assign({}, $xetable.importOpts, this.defaultOptions)).then(() => {
+            $xeTable.importByFile(this.storeData.file, Object.assign({}, $xeTable.importOpts, this.defaultOptions)).then(() => {
                 this.loading = false;
                 this.storeData.visible = false;
             }).catch(() => {