mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-28 05:05:48 +08:00
Code Issues Actions 43 Packages Projects Releases Wiki Activity

docs: grammatical changes and improve sentence flow (#5882)

Browse Source 
* Fixed some grammatical issues
* Prop descriptions are now more consistent
* Sentences flow better; they aren't as disjoint or terse
This commit is contained in:
ko 2017-04-25 01:37:18 -07:00 committed by Benjy Cui
parent cad727323b
commit e85708d16a
1 changed files with 35 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

70
components/tree/index.en-US.md
View File

@ -6,7 +6,7 @@ title: Tree
## When To Use
Directory, organization, biological classification, country, and etc. Almost things of the world are tree structure. The `Tree` component is a way of representing the hierarchical relationship of these things，and you also can expand, collapse, select the treeNodes of it.
Almost anything can be represented in a tree structure. Examples include directories, organization hierarchies, biological classifications, countries, etc. The `Tree` component is a way of representing the hierarchical relationship between these things. You can also expand, collapse, and select a treeNode within a `Tree`.
## API
@ -14,49 +14,49 @@ Directory, organization, biological classification, country, and etc. Almost thi
| Property | Description | Type | Default |
|----------------|--------------------------------------------------|------------|---------|
|multiple | Whether allow to select multiple treeNodes | boolean | false |
|checkable | Whether support add Checkbox before treeNode | boolean | false |
|defaultExpandAll | Whether default to expand all treeNodes | boolean | false |
|defaultExpandedKeys | Specify keys of default expanded treeNodes | string[] | [] |
|expandedKeys |(controlled) Specifies keys of expanded treeNodes | string[] | [] |
|multiple | Allows selecting multiple treeNodes | boolean | false |
|checkable | Adds a `Checkbox` before the treeNodes | boolean | false |
|defaultExpandAll | Whether to expand all treeNodes by default | boolean | false |
|defaultExpandedKeys | Specify the keys of the default expanded treeNodes | string[] | [] |
|expandedKeys |(Controlled) Specifies the keys of the expanded treeNodes | string[] | [] |
|autoExpandParent | Whether to automatically expand a parent treeNode | boolean | true |
|defaultCheckedKeys | Specifies keys of default checked treeNodes | string[] | [] |
|checkedKeys |(controlled) Specifies keys of checked treeNodes（PS： When specifies a key of treeNode which is a parent treeNode, all children treeNodes of its will be checked; And vice versa, when specifies a key of treeNode which is a child treeNode, its parent treeNode will also be checked. When `checkable` and `checkStrictly` is true, it'a object has `checked` and `halfChecked` property, and no matter child treeNode or parent treeNode is checked, they won't impact on eachother. | string[] \| {checked: string[], halfChecked: string[]} | [] |
|checkStrictly| Check treeNode precisely, parent treeNode and children treeNodes are not associated | boolean | false |
|defaultSelectedKeys | Specifies keys of default selected treeNodes | string[] | [] |
|selectedKeys |(controlled) Specifies keys of selected treeNode | string[] | - |
|onExpand | Defines a function will be called when expand or collapse a treeNode | function(expandedKeys, {expanded: bool, node}) | - |
|onCheck | Defines a function will be called when the onCheck event occurs | function(checkedKeys, e:{checked: bool, checkedNodes, node, event}) | - |
|onSelect | The callback will be invoked when the user clicks a treeNode | function(selectedKeys, e:{selected: bool, selectedNodes, node, event}) | - |
|filterTreeNode | Defines a function to filter treeNodes（highlight），when return true, corresponding treeNode will be highlight | function(node) | - |
|loadData | load data asynchronously | function(node)| - |
|onRightClick | The call back will be invoked when the user right clicks a treeNode | function({event, node}) | - |
|draggable | Specifies whether this Tree is draggable（IE>8） | boolean | false |
|onDragStart | Defines a function will be called when the onDragStart event occurs | function({event, node}) | - |
|onDragEnter | Defines a function will be called when the onDragEnter event occurs | function({event, node, expandedKeys}) | - |
|onDragOver | Defines a function will be called when the onDragOver event occurs | function({event, node}) | - |
|onDragLeave | Defines a function will be called when the onDragLeave event occurs | function({event, node}) | - |
|onDragEnd | Defines a function will be called when the onDragEnd event occurs | function({event, node}) | - |
|onDrop | Defines a function will be called when the onDrop event occurs | function({event, node, dragNode, dragNodesKeys}) | - |
|showLine | Whether show connecting line | boolean | false |
|showIcon | Whether show the icon before TreeNode title, which has no default style, you must set custom style for it if set to true | boolean | false |
|defaultCheckedKeys | Specifies the keys of the default checked treeNodes | string[] | [] |
|checkedKeys |(Controlled) Specifies the keys of the checked treeNodes (PS: When this specifies the key of a treeNode which is also a parent treeNode, all the children treeNodes of will be checked; and vice versa, when it specifies the key of a treeNode which is a child treeNode, its parent treeNode will also be checked. When `checkable` and `checkStrictly` is true, its object has `checked` and `halfChecked` property. Regardless of whether the child or parent treeNode is checked, they won't impact each other. | string[] \| {checked: string[], halfChecked: string[]} | [] |
|checkStrictly| Check treeNode precisely; parent treeNode and children treeNodes are not associated | boolean | false |
|defaultSelectedKeys | Specifies the keys of the default selected treeNodes | string[] | [] |
|selectedKeys |(Controlled) Specifies the keys of the selected treeNodes | string[] | - |
|onExpand | Callback function for when a treeNode is expanded or collapsed | function(expandedKeys, {expanded: bool, node}) | - |
|onCheck | Callback function for when the onCheck event occurs | function(checkedKeys, e:{checked: bool, checkedNodes, node, event}) | - |
|onSelect | Callback function for when the user clicks a treeNode | function(selectedKeys, e:{selected: bool, selectedNodes, node, event}) | - |
|filterTreeNode | Defines a function to filter (highlight) treeNodes. When the function returns `true`, the corresponding treeNode will be highlighted | function(node) | - |
|loadData | Load data asynchronously | function(node)| - |
|onRightClick | Callback function for when the user right clicks a treeNode | function({event, node}) | - |
|draggable | Specifies whether this Tree is draggable (IE > 8) | boolean | false |
|onDragStart | Callback function for when the onDragStart event occurs | function({event, node}) | - |
|onDragEnter | Callback function for when the onDragEnter event occurs | function({event, node, expandedKeys}) | - |
|onDragOver | Callback function for when the onDragOver event occurs | function({event, node}) | - |
|onDragLeave | Callback function for when the onDragLeave event occurs | function({event, node}) | - |
|onDragEnd | Callback function for when the onDragEnd event occurs | function({event, node}) | - |
|onDrop | Callback function for when the onDrop event occurs | function({event, node, dragNode, dragNodesKeys}) | - |
|showLine | Shows a connecting line | boolean | false |
|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 |
### TreeNode props
| Property | Description | Type | Default |
|-----------|------------------------------------------|---------|---------|
|disabled | whether disabled the treeNode | boolean | false |
|disableCheckbox | whether disable the checkbox of treeNode | boolean | false |
|title | title | string\|ReactNode | '---' |
|key | it's used with (default)ExpandedKeys / (default)CheckedKeys / (default)SelectedKeys. P.S.: it must be unique in all of treeNodes of the tree! | string | internal calculated position of treeNode |
|isLeaf | whether it's leaf node | boolean | false |
|disabled | Disables the treeNode | boolean | false |
|disableCheckbox | Disables the checkbox of the treeNode | boolean | false |
|title | Title | string\|ReactNode | '---' |
|key | Used with (default)ExpandedKeys / (default)CheckedKeys / (default)SelectedKeys. P.S.: It must be unique in all of treeNodes of the tree! | string | internal calculated position of treeNode |
|isLeaf | Determines if this is a leaf node | boolean | false |
## Note
The number of treeNodes can be very large, but when enable `checkable`,
it will spend more computing time, so we cache some calculations (e.g. `this.treeNodesStates`),
to avoid double computing. But, this bring some restrictions,
**when you load treeNodes asynchronously, you should render tree like this**。
The number of treeNodes can be very large, but when `checkable=true`,
it will increase the compute time. So, we cache some calculations (e.g. `this.treeNodesStates`)
to avoid double computing. But, this brings some restrictions.
**When you load treeNodes asynchronously, you should render tree like this**:
```jsx
{this.state.treeData.length