Skip to content

Commit 6c3e3d3

Browse files
tangjinzhoutangjinzhou
committed
docs: update tree doc
1 parent c7ab23c commit 6c3e3d3

File tree

3 files changed

+37
-22
lines changed

3 files changed

+37
-22
lines changed

‎components/tree/index.en-US.md

Lines changed: 17 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@
2020
| expandedKeys(.sync) | (Controlled) Specifies the keys of the expanded treeNodes | string\[] | \[] |
2121
| filterTreeNode | Defines a function to filter (highlight) treeNodes. When the function returns `true`, the corresponding treeNode will be highlighted | function(node) | - |
2222
| loadData | Load data asynchronously | function(node) | - |
23+
| loadedKeys | (Controlled) Set loaded tree nodes. Need work with `loadData` | string\[] | \[] |
2324
| multiple | Allows selecting multiple treeNodes | boolean | false |
2425
| selectedKeys(.sync) | (Controlled) Specifies the keys of the selected treeNodes | string\[] | - |
2526
| showIcon | Shows the icon before a TreeNode's title. There is no default style; you must set a custom style for it if set to `true` | boolean | false |
@@ -28,16 +29,17 @@
2829
### Events
2930
| Events Name | Description | Arguments |
3031
| --- | --- | --- |
31-
| check | Callback function for when the onCheck event occurs | function(checkedKeys, e:{checked: bool, checkedNodes, node, event}) | - |
32-
| dragEnd | Callback function for when the onDragEnd event occurs | function({event, node}) | - |
33-
| dragEnter | Callback function for when the onDragEnter event occurs | function({event, node, expandedKeys}) | - |
34-
| dragLeave | Callback function for when the onDragLeave event occurs | function({event, node}) | - |
35-
| dragOver | Callback function for when the onDragOver event occurs | function({event, node}) | - |
36-
| dragStart | Callback function for when the onDragStart event occurs | function({event, node}) | - |
37-
| drop | Callback function for when the onDrop event occurs | function({event, node, dragNode, dragNodesKeys}) | - |
38-
| expand | Callback function for when a treeNode is expanded or collapsed | function(expandedKeys, {expanded: bool, node}) | - |
39-
| rightClick | Callback function for when the user right clicks a treeNode | function({event, node}) | - |
40-
| select | Callback function for when the user clicks a treeNode | function(selectedKeys, e:{selected: bool, selectedNodes, node, event}) | - |
32+
| check | Callback function for when the onCheck event occurs | function(checkedKeys, e:{checked: bool, checkedNodes, node, event}) |
33+
| dragEnd | Callback function for when the onDragEnd event occurs | function({event, node}) |
34+
| dragEnter | Callback function for when the onDragEnter event occurs | function({event, node, expandedKeys}) |
35+
| dragLeave | Callback function for when the onDragLeave event occurs | function({event, node}) |
36+
| dragOver | Callback function for when the onDragOver event occurs | function({event, node}) |
37+
| dragStart | Callback function for when the onDragStart event occurs | function({event, node}) |
38+
| drop | Callback function for when the onDrop event occurs | function({event, node, dragNode, dragNodesKeys}) |
39+
| expand | Callback function for when a treeNode is expanded or collapsed | function(expandedKeys, {expanded: bool, node}) |
40+
| load | Callback function for when a treeNode is loaded | function(loadedKeys, {event, node}) |
41+
| rightClick | Callback function for when the user right clicks a treeNode | function({event, node}) |
42+
| select | Callback function for when the user clicks a treeNode | function(selectedKeys, e:{selected: bool, selectedNodes, node, event}) |
4143

4244
### TreeNode props
4345

@@ -59,3 +61,8 @@ One of the Tree `treeNode` prop for describing the tree's node, TreeNode has the
5961
| scopedSlots | When using treeNodes, you can use this property to configure the properties that support the slot-scope, such as `scopedSlots: { title: 'XXX'}` | object | - |
6062
| on | When using treeNodes, you can use this property to configure the events, such as `on: { click: () => {}}` | object | - |
6163

64+
### DirectoryTree props
65+
66+
| Property | Description | Type | Default |
67+
| --- | --- | --- | --- |
68+
| expandAction | Directory open logic, optional `false` `'click'` `'doubleclick'` | string | click |

‎components/tree/index.zh-CN.md

Lines changed: 19 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55

66
| 参数 | 说明 | 类型 | 默认值 |
77
| --- | --- | --- | --- |
8-
| treeNodes | 节点的配置描述，具体项见下表 | array | -- |
8+
| treeData | 节点的配置描述，具体项见下表, 1.1.4之前的版本使用`treeNodes` | array | -- |
99
| autoExpandParent | 是否自动展开父节点 | boolean | true |
1010
| checkable | 节点前添加 Checkbox 复选框 | boolean | false |
1111
| checkedKeys(v-model) | （受控）选中复选框的树节点（注意：父子节点有关联，如果传入父节点key，则子节点自动选中；相应当子节点key都传入，父节点也自动选中。当设置`checkable`和`checkStrictly`，它是一个有`checked`和`halfChecked`属性的对象，并且父子节点的选中与否不再关联 | string\[] \| {checked: string\[], halfChecked: string\[]} | \[] |
@@ -20,6 +20,7 @@
2020
| expandedKeys(.sync) | （受控）展开指定的树节点 | string\[] | \[] |
2121
| filterTreeNode | 按需筛选树节点（高亮），返回true | function(node) | - |
2222
| loadData | 异步加载数据 | function(node) | - |
23+
| loadedKeys | （受控）已经加载的节点，需要配合 `loadData` 使用 | string\[] | \[] |
2324
| multiple | 支持点选多个节点（节点本身） | boolean | false |
2425
| selectedKeys(.sync) | （受控）设置选中的树节点 | string\[] | - |
2526
| showIcon | 是否展示 TreeNode title 前的图标，没有默认样式，如设置为 true，需要自行定义图标相关样式 | boolean | false |
@@ -30,16 +31,17 @@
3031

3132
| 事件名称 | 说明 | 回调参数 |
3233
| --- | --- | --- |
33-
| check | 点击复选框触发 | function(checkedKeys, e:{checked: bool, checkedNodes, node, event}) | - |
34-
| dragEnd | dragend 触发时调用 | function({event, node}) | - |
35-
| dragEnter | dragenter 触发时调用 | function({event, node, expandedKeys}) | - |
36-
| dragLeave | dragleave 触发时调用 | function({event, node}) | - |
37-
| dragOver | dragover 触发时调用 | function({event, node}) | - |
38-
| dragStart | 开始拖拽时调用 | function({event, node}) | - |
39-
| drop | drop 触发时调用 | function({event, node, dragNode, dragNodesKeys}) | - |
40-
| expand | 展开/收起节点时触发 | function(expandedKeys, {expanded: bool, node}) | - |
41-
| rightClick | 响应右键点击 | function({event, node}) | - |
42-
| select | 点击树节点触发 | function(selectedKeys, e:{selected: bool, selectedNodes, node, event}) | - |
34+
| check | 点击复选框触发 | function(checkedKeys, e:{checked: bool, checkedNodes, node, event}) |
35+
| dragEnd | dragend 触发时调用 | function({event, node}) |
36+
| dragEnter | dragenter 触发时调用 | function({event, node, expandedKeys}) |
37+
| dragLeave | dragleave 触发时调用 | function({event, node}) |
38+
| dragOver | dragover 触发时调用 | function({event, node}) |
39+
| dragStart | 开始拖拽时调用 | function({event, node}) |
40+
| drop | drop 触发时调用 | function({event, node, dragNode, dragNodesKeys}) |
41+
| expand | 展开/收起节点时触发 | function(expandedKeys, {expanded: bool, node}) |
42+
| load | 节点加载完毕时触发 | function(loadedKeys, {event, node}) |
43+
| rightClick | 响应右键点击 | function({event, node}) |
44+
| select | 点击树节点触发 | function(selectedKeys, e:{selected: bool, selectedNodes, node, event}) |
4345

4446
### TreeNode props
4547

@@ -60,5 +62,11 @@
6062
| scopedSlots | 使用columns时，可以通过该属性配置支持slot-scope的属性，如 `scopedSlots: { title: 'XXX'}` | object | - |
6163
| on | 事件对象，仅在treeNodes使用方式中生效，如`{click: () => {}}` | object | '---' |
6264

65+
### DirectoryTree props
66+
67+
| 参数 | 说明 | 类型 | 默认值 |
68+
| --- | --- | --- | --- |
69+
| expandAction | 目录展开逻辑，可选 `false` `'click'` `'doubleclick'` | string | click |
70+
6371

6472

‎components/vc-tree/src/Tree.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -525,7 +525,7 @@ const Tree = {
525525

526526
onNodeContextMenu (event, node) {
527527
event.preventDefault()
528-
this.__emit('rightclick', { event, node })
528+
this.__emit('rightClick', { event, node })
529529
},
530530

531531
/**

0 commit comments

Comments
 (0)