vxe-table 3.19.39 → 3.20.0-beta.1

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

@@ -137,240 +137,243 @@ function checkRuleStatus(rule, val) {
     }
     return true;
 }
+/**
+ * 聚焦到校验通过的单元格并弹出校验错误提示
+ */
+function handleValidError($xeTable, params) {
+    return new Promise(resolve => {
+        const validOpts = $xeTable.computeValidOpts;
+        if (validOpts.autoPos === false) {
+            $xeTable.dispatchEvent('valid-error', params, null);
+            resolve();
+        }
+        else {
+            $xeTable.handleEdit(params, { type: 'valid-error', trigger: 'call' }).then(() => {
+                setTimeout(() => {
+                    resolve($xeTable.showValidTooltip(params));
+                }, 10);
+            });
+        }
+    });
+}
+function handleErrMsgMode($xeTable, validErrMaps) {
+    const validOpts = $xeTable.computeValidOpts;
+    if (validOpts.msgMode === 'single') {
+        const keys = Object.keys(validErrMaps);
+        const resMaps = {};
+        if (keys.length) {
+            const firstKey = keys[0];
+            resMaps[firstKey] = validErrMaps[firstKey];
+        }
+        return resMaps;
+    }
+    return validErrMaps;
+}
+/**
+ * 对表格数据进行校验
+ * 如果不指定数据，则默认只校验临时变动的数据，例如新增或修改
+ * 如果传 true 则校验当前表格数据
+ * 如果传 row 指定行记录，则只验证传入的行
+ * 如果传 rows 为多行记录，则只验证传入的行
+ * 如果只传 callback 否则默认验证整个表格数据
+ * 返回 Promise 对象，或者使用回调方式
+ */
+function beginValidate($xeTable, rows, cols, cb, isFull) {
+    const props = $xeTable;
+    const reactData = $xeTable;
+    const internalData = $xeTable;
+    const validRest = {};
+    const { editRules, treeConfig } = props;
+    const { isRowGroupStatus } = reactData;
+    const { afterFullData, pendingRowMaps, removeRowMaps } = internalData;
+    const treeOpts = $xeTable.computeTreeOpts;
+    const aggregateOpts = $xeTable.computeAggregateOpts;
+    const validOpts = $xeTable.computeValidOpts;
+    let validList;
+    if (rows === true) {
+        validList = afterFullData;
+    }
+    else if (rows) {
+        if (XEUtils.isFunction(rows)) {
+            cb = rows;
+        }
+        else {
+            validList = XEUtils.isArray(rows) ? rows : [rows];
+        }
+    }
+    if (!validList) {
+        validList = $xeTable.getInsertRecords().concat($xeTable.getUpdateRecords());
+    }
+    const rowValidErrs = [];
+    internalData._lastCallTime = Date.now();
+    internalData.validRuleErr = false; // 如果为快速校验，当存在某列校验不通过时将终止执行
+    $xeTable.clearValidate();
+    const validErrMaps = {};
+    if (editRules) {
+        const columns = cols && cols.length ? cols : $xeTable.getColumns();
+        const handleVaild = (row) => {
+            const rowid = getRowid($xeTable, row);
+            // 是否删除
+            if (removeRowMaps[rowid]) {
+                return;
+            }
+            // 是否标记删除
+            if (pendingRowMaps[rowid]) {
+                return;
+            }
+            if ($xeTable.isAggregateRecord(row)) {
+                return;
+            }
+            if (isFull || !internalData.validRuleErr) {
+                const colVailds = [];
+                columns.forEach((column) => {
+                    const field = XEUtils.isString(column) ? column : column.field;
+                    if ((isFull || !internalData.validRuleErr) && XEUtils.has(editRules, field)) {
+                        colVailds.push($xeTable.validCellRules('all', row, column)
+                            .catch(({ rule, rules }) => {
+                            const rest = {
+                                rule,
+                                rules,
+                                rowIndex: $xeTable.getRowIndex(row),
+                                row,
+                                columnIndex: $xeTable.getColumnIndex(column),
+                                column,
+                                field,
+                                $table: $xeTable
+                            };
+                            if (!validRest[field]) {
+                                validRest[field] = [];
+                            }
+                            validErrMaps[`${getRowid($xeTable, row)}:${column.id}`] = {
+                                column,
+                                row,
+                                rule,
+                                content: rule.content
+                            };
+                            validRest[field].push(rest);
+                            if (!isFull) {
+                                internalData.validRuleErr = true;
+                                return Promise.reject(rest);
+                            }
+                        }));
+                    }
+                });
+                rowValidErrs.push(Promise.all(colVailds));
+            }
+        };
+        if (isRowGroupStatus) {
+            XEUtils.eachTree(validList, handleVaild, { children: aggregateOpts.mapChildrenField });
+        }
+        else if (treeConfig) {
+            const childrenField = treeOpts.children || treeOpts.childrenField;
+            XEUtils.eachTree(validList, handleVaild, { children: childrenField });
+        }
+        else {
+            validList.forEach(handleVaild);
+        }
+        return Promise.all(rowValidErrs).then(() => {
+            const ruleProps = Object.keys(validRest);
+            reactData.validErrorMaps = handleErrMsgMode($xeTable, validErrMaps);
+            return $xeTable.$nextTick().then(() => {
+                if (ruleProps.length) {
+                    return Promise.reject(validRest[ruleProps[0]][0]);
+                }
+                if (cb) {
+                    cb();
+                }
+            });
+        }).catch(firstErrParams => {
+            return new Promise((resolve, reject) => {
+                const finish = () => {
+                    $xeTable.$nextTick(() => {
+                        if (cb) {
+                            cb(validRest);
+                            resolve();
+                        }
+                        else {
+                            if (getConfig().validToReject === 'obsolete') {
+                                // 已废弃，校验失败将不会执行catch
+                                reject(validRest);
+                            }
+                            else {
+                                resolve(validRest);
+                            }
+                        }
+                    });
+                };
+                const posAndFinish = () => {
+                    firstErrParams.cell = $xeTable.getCellElement(firstErrParams.row, firstErrParams.column);
+                    scrollToView(firstErrParams.cell);
+                    handleValidError($xeTable, firstErrParams).then(finish);
+                };
+                /**
+                 * 当校验不通过时
+                 * 将表格滚动到可视区
+                 * 由于提示信息至少需要占一行，定位向上偏移一行
+                 */
+                if (validOpts.autoPos === false) {
+                    finish();
+                }
+                else {
+                    const row = firstErrParams.row;
+                    const column = firstErrParams.column;
+                    $xeTable.scrollToRow(row, column).then(posAndFinish);
+                }
+            });
+        });
+    }
+    else {
+        reactData.validErrorMaps = {};
+    }
+    return $xeTable.$nextTick().then(() => {
+        if (cb) {
+            cb();
+        }
+    });
+}
 export default {
     methods: {
         /**
          * 完整校验，和 validate 的区别就是会给有效数据中的每一行进行校验
          */
         _fullValidate(rows, cb) {
+            const $xeTable = this;
             if (XEUtils.isFunction(cb)) {
                 warnLog('vxe.error.notValidators', ['fullValidate(rows, callback)', 'fullValidate(rows)']);
             }
-            return this.beginValidate(rows, null, cb, true);
+            return beginValidate($xeTable, rows, null, cb, true);
         },
         /**
          * 快速校验，如果存在记录不通过的记录，则返回不再继续校验（异步校验除外）
          */
         _validate(rows, cb) {
+            const $xeTable = this;
             if (XEUtils.isFunction(cb)) {
                 warnLog('vxe.error.notValidators', ['validate(rows, callback)', 'validate(rows)']);
             }
-            return this.beginValidate(rows, null, cb);
+            return beginValidate($xeTable, rows, null, cb);
         },
         /**
          * 完整校验单元格，和 validateField 的区别就是会给有效数据中的每一行进行校验
          */
         _fullValidateField(rows, fieldOrColumn) {
+            const $xeTable = this;
             const colList = (XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : (fieldOrColumn ? [fieldOrColumn] : [])).map(column => handleFieldOrColumn(this, column));
             if (colList.length) {
-                return this.beginValidate(rows, colList, null, true);
+                return beginValidate($xeTable, rows, colList, null, true);
             }
-            return this.$nextTick();
+            return $xeTable.$nextTick();
         },
         /**
          * 快速校验单元格，如果存在记录不通过的记录，则返回不再继续校验（异步校验除外）
          */
         _validateField(rows, fieldOrColumn) {
+            const $xeTable = this;
             const colList = (XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : (fieldOrColumn ? [fieldOrColumn] : [])).map(column => handleFieldOrColumn(this, column));
             if (colList.length) {
-                return this.beginValidate(rows, colList, null);
-            }
-            return this.$nextTick();
-        },
-        /**
-         * 聚焦到校验通过的单元格并弹出校验错误提示
-         */
-        handleValidError(params) {
-            const $xeTable = this;
-            const { validOpts } = this;
-            return new Promise(resolve => {
-                if (validOpts.autoPos === false) {
-                    $xeTable.dispatchEvent('valid-error', params, null);
-                    resolve();
-                }
-                else {
-                    this.handleEdit(params, { type: 'valid-error', trigger: 'call' }).then(() => {
-                        setTimeout(() => {
-                            resolve(this.showValidTooltip(params));
-                        }, 10);
-                    });
-                }
-            });
-        },
-        handleErrMsgMode(validErrMaps) {
-            const { validOpts } = this;
-            if (validOpts.msgMode === 'single') {
-                const keys = Object.keys(validErrMaps);
-                const resMaps = {};
-                if (keys.length) {
-                    const firstKey = keys[0];
-                    resMaps[firstKey] = validErrMaps[firstKey];
-                }
-                return resMaps;
+                return beginValidate($xeTable, rows, colList, null);
             }
-            return validErrMaps;
-        },
-        /**
-         * 对表格数据进行校验
-         * 如果不指定数据，则默认只校验临时变动的数据，例如新增或修改
-         * 如果传 true 则校验当前表格数据
-         * 如果传 row 指定行记录，则只验证传入的行
-         * 如果传 rows 为多行记录，则只验证传入的行
-         * 如果只传 callback 否则默认验证整个表格数据
-         * 返回 Promise 对象，或者使用回调方式
-         */
-        beginValidate(rows, cols, cb, isFull) {
-            const $xeTable = this;
-            const props = $xeTable;
-            const reactData = $xeTable;
-            const internalData = $xeTable;
-            const validRest = {};
-            const { editRules, treeConfig } = props;
-            const { isRowGroupStatus } = reactData;
-            const { afterFullData, pendingRowMaps, removeRowMaps } = internalData;
-            const treeOpts = $xeTable.computeTreeOpts;
-            const aggregateOpts = $xeTable.computeAggregateOpts;
-            let validList;
-            if (rows === true) {
-                validList = afterFullData;
-            }
-            else if (rows) {
-                if (XEUtils.isFunction(rows)) {
-                    cb = rows;
-                }
-                else {
-                    validList = XEUtils.isArray(rows) ? rows : [rows];
-                }
-            }
-            if (!validList) {
-                validList = this.getInsertRecords().concat(this.getUpdateRecords());
-            }
-            const rowValidErrs = [];
-            this.lastCallTime = Date.now();
-            this.validRuleErr = false; // 如果为快速校验，当存在某列校验不通过时将终止执行
-            this.clearValidate();
-            const validErrMaps = {};
-            if (editRules) {
-                const columns = cols && cols.length ? cols : this.getColumns();
-                const handleVaild = (row) => {
-                    const rowid = getRowid($xeTable, row);
-                    // 是否删除
-                    if (removeRowMaps[rowid]) {
-                        return;
-                    }
-                    // 是否标记删除
-                    if (pendingRowMaps[rowid]) {
-                        return;
-                    }
-                    if ($xeTable.isAggregateRecord(row)) {
-                        return;
-                    }
-                    if (isFull || !this.validRuleErr) {
-                        const colVailds = [];
-                        columns.forEach((column) => {
-                            const field = XEUtils.isString(column) ? column : column.field;
-                            if ((isFull || !this.validRuleErr) && XEUtils.has(editRules, field)) {
-                                colVailds.push(this.validCellRules('all', row, column)
-                                    .catch(({ rule, rules }) => {
-                                    const rest = {
-                                        rule,
-                                        rules,
-                                        rowIndex: this.getRowIndex(row),
-                                        row,
-                                        columnIndex: this.getColumnIndex(column),
-                                        column,
-                                        field,
-                                        $table: this
-                                    };
-                                    if (!validRest[field]) {
-                                        validRest[field] = [];
-                                    }
-                                    validErrMaps[`${getRowid(this, row)}:${column.id}`] = {
-                                        column,
-                                        row,
-                                        rule,
-                                        content: rule.content
-                                    };
-                                    validRest[field].push(rest);
-                                    if (!isFull) {
-                                        this.validRuleErr = true;
-                                        return Promise.reject(rest);
-                                    }
-                                }));
-                            }
-                        });
-                        rowValidErrs.push(Promise.all(colVailds));
-                    }
-                };
-                if (isRowGroupStatus) {
-                    XEUtils.eachTree(validList, handleVaild, { children: aggregateOpts.mapChildrenField });
-                }
-                else if (treeConfig) {
-                    const childrenField = treeOpts.children || treeOpts.childrenField;
-                    XEUtils.eachTree(validList, handleVaild, { children: childrenField });
-                }
-                else {
-                    validList.forEach(handleVaild);
-                }
-                return Promise.all(rowValidErrs).then(() => {
-                    const ruleProps = Object.keys(validRest);
-                    this.validErrorMaps = this.handleErrMsgMode(validErrMaps);
-                    return this.$nextTick().then(() => {
-                        if (ruleProps.length) {
-                            return Promise.reject(validRest[ruleProps[0]][0]);
-                        }
-                        if (cb) {
-                            cb();
-                        }
-                    });
-                }).catch(firstErrParams => {
-                    return new Promise((resolve, reject) => {
-                        const finish = () => {
-                            this.$nextTick(() => {
-                                if (cb) {
-                                    cb(validRest);
-                                    resolve();
-                                }
-                                else {
-                                    if (getConfig().validToReject === 'obsolete') {
-                                        // 已废弃，校验失败将不会执行catch
-                                        reject(validRest);
-                                    }
-                                    else {
-                                        resolve(validRest);
-                                    }
-                                }
-                            });
-                        };
-                        const posAndFinish = () => {
-                            firstErrParams.cell = this.getCellElement(firstErrParams.row, firstErrParams.column);
-                            scrollToView(firstErrParams.cell);
-                            this.handleValidError(firstErrParams).then(finish);
-                        };
-                        /**
-                         * 当校验不通过时
-                         * 将表格滚动到可视区
-                         * 由于提示信息至少需要占一行，定位向上偏移一行
-                         */
-                        if (this.validOpts.autoPos === false) {
-                            finish();
-                        }
-                        else {
-                            const row = firstErrParams.row;
-                            const column = firstErrParams.column;
-                            this.scrollToRow(row, column).then(posAndFinish);
-                        }
-                    });
-                });
-            }
-            else {
-                this.validErrorMaps = {};
-            }
-            return this.$nextTick().then(() => {
-                if (cb) {
-                    cb();
-                }
-            });
+            return $xeTable.$nextTick();
         },
         hasCellRules(type, row, column) {
             const { editRules } = this;
@@ -396,14 +399,17 @@ export default {
          *  trigger=blur|change 触发方式（除非特殊场景，否则默认为空就行）
          */
         validCellRules(validType, row, column, val) {
-            const { editRules } = this;
-            const { property } = column;
+            const $xeTable = this;
+            const props = $xeTable;
+            const internalData = $xeTable;
+            const { editRules } = props;
+            const { field } = column;
             const errorRules = [];
             const syncValidList = [];
-            if (property && editRules) {
-                const rules = XEUtils.get(editRules, property);
+            if (field && editRules) {
+                const rules = XEUtils.get(editRules, field);
                 if (rules) {
-                    const cellValue = XEUtils.isUndefined(val) ? XEUtils.get(row, property) : val;
+                    const cellValue = XEUtils.isUndefined(val) ? XEUtils.get(row, field) : val;
                     rules.forEach((rule) => {
                         const { trigger, validator } = rule;
                         if (validType === 'all' || !trigger || validType === trigger) {
@@ -413,11 +419,11 @@ export default {
                                     rule,
                                     rules,
                                     row,
-                                    rowIndex: this.getRowIndex(row),
+                                    rowIndex: $xeTable.getRowIndex(row),
                                     column,
-                                    columnIndex: this.getColumnIndex(column),
-                                    field: column.property,
-                                    $table: this
+                                    columnIndex: $xeTable.getColumnIndex(column),
+                                    field: column.field,
+                                    $table: $xeTable
                                 };
                                 let customValid;
                                 if (XEUtils.isString(validator)) {
@@ -440,13 +446,13 @@ export default {
                                 }
                                 if (customValid) {
                                     if (XEUtils.isError(customValid)) {
-                                        this.validRuleErr = true;
+                                        internalData.validRuleErr = true;
                                         errorRules.push(new Rule({ type: 'custom', trigger, content: customValid.message, rule: new Rule(rule) }));
                                     }
                                     else if (customValid.catch) {
                                         // 如果为异步校验（注：异步校验是并发无序的）
                                         syncValidList.push(customValid.catch((e) => {
-                                            this.validRuleErr = true;
+                                            internalData.validRuleErr = true;
                                             errorRules.push(new Rule({ type: 'custom', trigger, content: e && e.message ? e.message : (rule.content || rule.message), rule: new Rule(rule) }));
                                         }));
                                     }
@@ -454,7 +460,7 @@ export default {
                             }
                             else {
                                 if (!checkRuleStatus(rule, cellValue)) {
-                                    this.validRuleErr = true;
+                                    internalData.validRuleErr = true;
                                     errorRules.push(new Rule(rule));
                                 }
                             }
@@ -470,24 +476,27 @@ export default {
             });
         },
         _clearValidate(rows, fieldOrColumn) {
-            const { validOpts, validErrorMaps } = this;
-            const validTip = this.$refs.refValidTooltip;
+            const $xeTable = this;
+            const reactData = $xeTable;
+            const { validErrorMaps } = reactData;
+            const validTip = $xeTable.$refs.refValidTooltip;
+            const validOpts = $xeTable.computeValidOpts;
             const rowList = XEUtils.isArray(rows) ? rows : (rows ? [rows] : []);
-            const colList = (XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : (fieldOrColumn ? [fieldOrColumn] : [])).map(column => handleFieldOrColumn(this, column));
+            const colList = (XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : (fieldOrColumn ? [fieldOrColumn] : [])).map(column => handleFieldOrColumn($xeTable, column));
             let validErrMaps = {};
-            if (validTip && validTip.visible) {
+            if (validTip && validTip.reactData.visible) {
                 validTip.close();
             }
             // 如果是单个提示模式
             if (validOpts.msgMode === 'single') {
-                this.validErrorMaps = {};
-                return this.$nextTick();
+                reactData.validErrorMaps = {};
+                return $xeTable.$nextTick();
             }
             if (rowList.length && colList.length) {
                 validErrMaps = Object.assign({}, validErrorMaps);
                 rowList.forEach(row => {
                     colList.forEach((column) => {
-                        const validKey = `${getRowid(this, row)}:${column.id}`;
+                        const validKey = `${getRowid($xeTable, row)}:${column.id}`;
                         if (validErrMaps[validKey]) {
                             delete validErrMaps[validKey];
                         }
@@ -495,7 +504,7 @@ export default {
                 });
             }
             else if (rowList.length) {
-                const rowIdList = rowList.map(row => `${getRowid(this, row)}`);
+                const rowIdList = rowList.map(row => `${getRowid($xeTable, row)}`);
                 XEUtils.each(validErrorMaps, (item, key) => {
                     if (rowIdList.indexOf(key.split(':')[0]) > -1) {
                         validErrMaps[key] = item;
@@ -510,32 +519,38 @@ export default {
                     }
                 });
             }
-            this.validErrorMaps = validErrMaps;
-            return this.$nextTick();
+            reactData.validErrorMaps = validErrMaps;
+            return $xeTable.$nextTick();
         },
         /**
          * 触发校验
          */
         triggerValidate(type) {
-            const { editConfig, editStore, editRules, editOpts, validOpts } = this;
+            const $xeTable = this;
+            const props = $xeTable;
+            const reactData = $xeTable;
+            const { editConfig, editRules } = props;
+            const { editStore } = reactData;
             const { actived } = editStore;
+            const editOpts = $xeTable.computeEditOpts;
+            const validOpts = $xeTable.computeValidOpts;
             // 检查清除校验消息
             if (editRules && validOpts.msgMode === 'single') {
-                this.validErrorMaps = {};
+                reactData.validErrorMaps = {};
             }
             // 校验单元格
             if (editConfig && editRules && actived.row) {
                 const { row, column, cell } = actived.args;
-                if (this.hasCellRules(type, row, column)) {
-                    return this.validCellRules(type, row, column).then(() => {
+                if ($xeTable.hasCellRules(type, row, column)) {
+                    return $xeTable.validCellRules(type, row, column).then(() => {
                         if (editOpts.mode === 'row') {
-                            this.clearValidate(row, column);
+                            $xeTable.clearValidate(row, column);
                         }
                     }).catch(({ rule }) => {
                         // 如果校验不通过与触发方式一致，则聚焦提示错误，否则跳过并不作任何处理
                         if (!rule.trigger || type === rule.trigger) {
                             const rest = { rule, row, column, cell };
-                            this.showValidTooltip(rest);
+                            $xeTable.showValidTooltip(rest);
                             return Promise.reject(rest);
                         }
                         return Promise.resolve();
@@ -549,14 +564,18 @@ export default {
          */
         showValidTooltip(params) {
             const $xeTable = this;
-            const { $refs, height, validStore, validErrorMaps, tableData, validOpts } = this;
+            const props = $xeTable;
+            const reactData = $xeTable;
+            const { height } = props;
+            const { tableData, validStore, validErrorMaps } = reactData;
             const { rule, row, column, cell } = params;
-            const validTip = $refs.refValidTooltip;
+            const validOpts = $xeTable.computeValidOpts;
+            const validTip = $xeTable.$refs.refValidTooltip;
             const content = rule.content;
             validStore.visible = true;
             if (validOpts.msgMode === 'single') {
-                this.validErrorMaps = {
-                    [`${getRowid(this, row)}:${column.id}`]: {
+                reactData.validErrorMaps = {
+                    [`${getRowid($xeTable, row)}:${column.id}`]: {
                         column,
                         row,
                         rule,
@@ -565,8 +584,8 @@ export default {
                 };
             }
             else {
-                this.validErrorMaps = Object.assign({}, validErrorMaps, {
-                    [`${getRowid(this, row)}:${column.id}`]: {
+                reactData.validErrorMaps = Object.assign({}, validErrorMaps, {
+                    [`${getRowid($xeTable, row)}:${column.id}`]: {
                         column,
                         row,
                         rule,
@@ -580,7 +599,7 @@ export default {
                     return validTip.open(cell, content);
                 }
             }
-            return this.$nextTick();
+            return $xeTable.$nextTick();
         }
     }
 };

package/es/table/src/body.js

@@ -129,7 +129,7 @@ function renderTdColumn(h, $xeTable, seq, rowid, fixedType, isOptimizeMode, rowL
     const cellAlign = align || (compConf ? compConf.tableCellAlign : '') || allAlign;
     const cellVerticalAlign = XEUtils.eqNull(verticalAlign) ? allVerticalAlign : verticalAlign;
     const errorValidItem = validErrorMaps[`${rowid}:${colid}`];
-    const showValidTip = editRules && validOpts.showMessage && (validOpts.message === 'default' ? (height || tableData.length > 1) : validOpts.message === 'inline');
+    const showValidTip = editRules && validOpts.showErrorMessage && (validOpts.message === 'default' ? (height || tableData.length > 1) : validOpts.message === 'inline');
     const tdAttrs = { colid };
     const cellParams = {
         $table: $xeTable,
@@ -417,6 +417,7 @@ function renderTdColumn(h, $xeTable, seq, rowid, fixedType, isOptimizeMode, rowL
                 'col--dirty': isDirty,
                 'col--active': editConfig && isEdit && (actived.row === row && (actived.column === column || editOpts.mode === 'row')),
                 'col--valid-error': !!errorValidItem,
+                'show--valid-bg': errorValidItem && validOpts.showErrorBackground,
                 'col--current': currentColumn === column
             },
             getClass(compCellClassName, cellParams),

package/es/table/src/cell.js

@@ -472,7 +472,7 @@ export const Cell = {
         ]);
     },
     renderDeepCell(h, params) {
-        return Cell.renderDeepNodeBtn(h, params, Cell.renderDefaultCell.call(this, h, params));
+        return Cell.renderDeepNodeBtn(h, params, Cell.renderDefaultCell(h, params));
     },
     renderDefaultFooter(h, params) {
         return getFooterContent(h, params);
@@ -1224,7 +1224,7 @@ export const Cell = {
                 }, [getDefaultCellLabel(cellParams)])
             ]);
         }
-        return Cell.renderDefaultCell.call($table, h, cellParams);
+        return Cell.renderDefaultCell(h, cellParams);
     }
 };
 export default Cell;