github
/
element
mirror of https://github.com/ElemeFE/element
1
0
Fork 0
Code Issues Releases Wiki Activity

Table: Fix tree table when updating data (#16481)

pull/16303/head^2
Zhi Cun 2019-07-09 18:56:17 +08:00 committed by hetech
parent 6f51ad81fb
commit 40946e1230
1 changed files with 78 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
packages/table/src/store/tree.js
View File

@ -59,9 +59,16 @@ export default {
methods: { methods: {
normalize(data) { normalize(data) {
const { childrenColumnName, lazyColumnIdentifier, rowKey, lazy } = this.states; const {
childrenColumnName,
lazyColumnIdentifier,
rowKey,
lazy
} = this.states;
const res = {}; const res = {};
walkTreeNode(data, (parent, children, level) => { walkTreeNode(
data,
(parent, children, level) => {
const parentId = getRowIdentity(parent, rowKey); const parentId = getRowIdentity(parent, rowKey);
if (Array.isArray(children)) { if (Array.isArray(children)) {
res[parentId] = { res[parentId] = {
@ -76,7 +83,10 @@ export default {
level level
}; };
} }
}, childrenColumnName, lazyColumnIdentifier); },
childrenColumnName,
lazyColumnIdentifier
);
return res; return res;
}, },
@ -84,12 +94,19 @@ export default {
const nested = this.normalizedData; const nested = this.normalizedData;
const normalizedLazyNode = this.normalizedLazyNode; const normalizedLazyNode = this.normalizedLazyNode;
const keys = Object.keys(nested); const keys = Object.keys(nested);
if (!keys.length) return;
const { treeData: oldTreeData, defaultExpandAll, expandRowKeys, lazy } = this.states;
const newTreeData = {}; const newTreeData = {};
if (keys.length) {
const {
treeData: oldTreeData,
defaultExpandAll,
expandRowKeys,
lazy
} = this.states;
const rootLazyRowKeys = []; const rootLazyRowKeys = [];
const getExpanded = (oldValue, key) => { const getExpanded = (oldValue, key) => {
const included = defaultExpandAll || (expandRowKeys && expandRowKeys.indexOf(key) !== -1); const included =
defaultExpandAll ||
(expandRowKeys && expandRowKeys.indexOf(key) !== -1);
return !!((oldValue && oldValue.expanded) || included); return !!((oldValue && oldValue.expanded) || included);
}; };
// 合并 expanded 与 display，确保数据刷新后，状态不变 // 合并 expanded 与 display，确保数据刷新后，状态不变
@ -130,6 +147,7 @@ export default {
} }
}); });
} }
}
this.states.treeData = newTreeData; this.states.treeData = newTreeData;
this.updateTableScrollY(); this.updateTableScrollY();
}, },
@ -149,7 +167,7 @@ export default {
const id = getRowIdentity(row, rowKey); const id = getRowIdentity(row, rowKey);
const data = id && treeData[id]; const data = id && treeData[id];
const oldExpanded = treeData[id].expanded; const oldExpanded = treeData[id].expanded;
if (id && data && ('expanded' in data)) { if (id && data && 'expanded' in data) {
expanded = typeof expanded === 'undefined' ? !data.expanded : expanded; expanded = typeof expanded === 'undefined' ? !data.expanded : expanded;
treeData[id].expanded = expanded; treeData[id].expanded = expanded;
if (oldExpanded !== expanded) { if (oldExpanded !== expanded) {
@ -164,7 +182,7 @@ export default {
const { lazy, treeData, rowKey } = this.states; const { lazy, treeData, rowKey } = this.states;
const id = getRowIdentity(row, rowKey); const id = getRowIdentity(row, rowKey);
const data = treeData[id]; const data = treeData[id];
if (lazy && data && ('loaded' in data) && !data.loaded) { if (lazy && data && 'loaded' in data && !data.loaded) {
this.loadData(row, id, data); this.loadData(row, id, data);
} else { } else {
this.toggleTreeExpansion(row); this.toggleTreeExpansion(row);
@ -176,7 +194,7 @@ export default {
const { lazyTreeNodeMap, treeData } = this.states; const { lazyTreeNodeMap, treeData } = this.states;
if (load && !treeData[key].loaded) { if (load && !treeData[key].loaded) {
treeData[key].loading = true; treeData[key].loading = true;
load(row, treeNode, (data) => { load(row, treeNode, data => {
if (!Array.isArray(data)) { if (!Array.isArray(data)) {
throw new Error('[ElTable] data must be an array'); throw new Error('[ElTable] data must be an array');
} }