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

[tree]:add node-expand and node-collapse event

pull/2507/head
张华焱 2017-01-24 10:37:44 +08:00
parent 28b3883379
commit edf2f914da
5 changed files with 11 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
examples/docs/en-US/tree.md
View File

@ -351,6 +351,6 @@ Only one node among the same level can be expanded at one time.
| node-click | triggers when a node is clicked | three parameters: node object corresponding to the node clicked, `node` property of TreeNode, TreeNode itself |
| check-change | triggers when the selected state of the node changes | three parameters: node object corresponding to the node whose selected state is changed, whether the node is selected, whether node's subtree has selected nodes |
| current-change | triggers when current node changes | two parameters: node object corresponding to the current node, `node` property of TreeNode |
| node-open | triggers when current node open | three parameters: node object corresponding to the node opened, `node` property of TreeNode, TreeNode itself |
| node-close | triggers when current node close | three parameters: node object corresponding to the node closed, `node` property of TreeNode, TreeNode itself |
| node-expand | triggers when current node open | three parameters: node object corresponding to the node opened, `node` property of TreeNode, TreeNode itself |
| node-collapse | triggers when current node close | three parameters: node object corresponding to the node closed, `node` property of TreeNode, TreeNode itself |

5
examples/docs/zh-CN/tree.md
View File

@ -363,5 +363,6 @@
| node-click | 节点被点击时的回调 | 共三个参数，依次为：传递给 `data` 属性的数组中该节点所对应的对象、节点对应的 Node、节点组件本身。 |
| check-change | 节点选中状态发生变化时的回调 | 共三个参数，依次为：传递给 `data` 属性的数组中该节点所对应的对象、节点本身是否被选中、节点的子树中是否有被选中的节点 |
| current-change | 当前选中节点变化时触发的事件 | 共两个参数，依次为：当前节点的数据，当前节点的 Node 对象 |
| node-open | 节点被展开时触发的事件 | 共三个参数，依次为：传递给 `data` 属性的数组中该节点所对应的对象、节点对应的 Node、节点组件本身。 |
| node-close | 节点被关闭时触发的事件 | 共三个参数，依次为：传递给 `data` 属性的数组中该节点所对应的对象、节点对应的 Node、节点组件本身。 |
| node-expand | 节点被展开时触发的事件 | 共三个参数，依次为：传递给 `data` 属性的数组中该节点所对应的对象、节点对应的 Node、节点组件本身。 |
| node-collapse | 节点被关闭时触发的事件 | 共三个参数，依次为：传递给 `data` 属性的数组中该节点所对应的对象、节点对应的 Node、节点组件本身。 |

8
packages/tree/src/tree-node.vue
View File

@ -36,7 +36,7 @@
v-for="child in node.childNodes"
:key="getNodeKey(child)"
:node="child"
@node-expand="handleChildNodeExpand(child)">
@node-expand="handleChildNodeExpand">
</el-tree-node>
</div>
</collapse-transition>
@ -146,10 +146,9 @@
handleExpandIconClick() {
if (this.expanded) {
this.tree.$emit('node-close', this.node.data, this.node, this);
this.tree.$emit('node-collapse', this.node.data, this.node, this);
this.node.collapse();
} else {
this.tree.$emit('node-open', this.node.data, this.node, this);
this.node.expand();
this.$emit('node-expand', this.node.data, this.node, this);
}
@ -167,8 +166,9 @@
}
},
handleChildNodeExpand(node) {
handleChildNodeExpand(nodeData, node, instance) {
this.broadcast('ElTreeNode', 'tree-node-expand', node);
this.tree.$emit('node-expand', nodeData, node, instance);
}
},

1
packages/tree/src/tree.vue
View File

@ -143,6 +143,7 @@
},
handleNodeExpand(nodeData, node, instance) {
this.broadcast('ElTreeNode', 'tree-node-expand', node);
this.$emit('node-expand', nodeData, node, instance);
}
},

2
test/unit/specs/tree.spec.js
View File

@ -371,7 +371,7 @@ describe('Tree', () => {
});
it('handleNodeOpen & handleNodeClose', (done) => {
vm = getTreeVm(':props="defaultProps" lazy :load="loadNode" @node-open="handleNodeOpen" @node-close="handleNodeClose"', {
vm = getTreeVm(':props="defaultProps" lazy :load="loadNode" @node-expand="handleNodeOpen" @node-collapse="handleNodeClose"', {
methods: {
loadNode(node, resolve) {
if (node.level === 0) {