Tree: Fix issue #15538 caused by two Tree sharing the same data. (#15615)

* Tree: fix #15538 by adding more detect logic.

* Tree: fix #15538 and add test case.

* Tree: fix eslint error

* Tree: remove arrayContains function
pull/16185/head
VanMess 2019-06-11 10:05:36 +08:00 committed by island205
parent 69715b6154
commit ca9a0330f8
2 changed files with 65 additions and 3 deletions

View File

@ -1,5 +1,6 @@
import objectAssign from 'element-ui/src/utils/merge'; import objectAssign from 'element-ui/src/utils/merge';
import { markNodeData, NODE_KEY } from './util'; import { markNodeData, NODE_KEY } from './util';
import { arrayFindIndex } from 'element-ui/src/utils/util';
export const getChildState = node => { export const getChildState = node => {
let all = true; let all = true;
@ -435,8 +436,10 @@ export default class Node {
const newNodes = []; const newNodes = [];
newData.forEach((item, index) => { newData.forEach((item, index) => {
if (item[NODE_KEY]) { const key = item[NODE_KEY];
newDataMap[item[NODE_KEY]] = { index, data: item }; const isNodeExists = !!key && arrayFindIndex(oldData, data => data[NODE_KEY] === key) >= 0;
if (isNodeExists) {
newDataMap[key] = { index, data: item };
} else { } else {
newNodes.push({ index, data: item }); newNodes.push({ index, data: item });
} }

View File

@ -1,4 +1,4 @@
import { createVue, destroyVM, waitImmediate } from '../util'; import { createVue, destroyVM, waitImmediate, wait } from '../util';
const DELAY = 10; const DELAY = 10;
@ -831,4 +831,63 @@ describe('Tree', () => {
done(); done();
}); });
}); });
it('update multi tree data', async() => {
const vm = createVue({
template: `
<div>
<el-tree ref="tree1" :data="data" node-key="id" :props="defaultProps"></el-tree>
<el-tree ref="tree2" :data="data" node-key="id" :props="defaultProps"></el-tree>
</div>
`,
data() {
return {
data: [{
id: 1,
label: '一级 1',
children: [{
id: 11,
label: '二级 1-1',
children: [{
id: 111,
label: '三级 1-1'
}]
}]
}, {
id: 2,
label: '一级 2',
children: [{
id: 21,
label: '二级 2-1'
}, {
id: 22,
label: '二级 2-2'
}]
}, {
id: 3,
label: '一级 3',
children: [{
id: 31,
label: '二级 3-1'
}, {
id: 32,
label: '二级 3-2'
}]
}],
defaultProps: {
children: 'children',
label: 'label'
}
};
}
}, true);
const nodeData = { label: '新增 1', id: 4 };
vm.data.push(nodeData);
await wait();
const tree1 = vm.$refs.tree1;
expect(tree1.getNode(4).data).to.equal(nodeData);
const tree2 = vm.$refs.tree2;
expect(tree2.getNode(4).data).to.equal(nodeData);
});
}); });