mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-01-18 22:36:31 +08:00
Code Issues Actions 26 Packages Projects Releases Wiki Activity

docs: format api timeline/tooltip/tree (#25377)

Browse Source
This commit is contained in:
xrkffgg 2020-07-02 11:56:48 +08:00 committed by GitHub
parent 879bcd1479
commit b423a09233
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 51 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
components/timeline/index.en-US.md
View File

@ -29,10 +29,10 @@ Timeline
| Property | Description | Type | Default |
| --- | --- | --- | --- |
| pending | Set the last ghost node's existence or its content | boolean\|string\|ReactNode | false |
| pendingDot | Set the dot of the last ghost node when pending is true | string\|ReactNode | `<LoadingOutlined />` |
| reverse | reverse nodes or not | boolean | false |
| mode | By sending `alternate` the timeline will distribute the nodes to the left and right. | `left` \| `alternate` \| `right` | - |
| pending | Set the last ghost node's existence or its content | boolean \| string \| ReactNode | false |
| pendingDot | Set the dot of the last ghost node when pending is true | string \| ReactNode | &lt;LoadingOutlined /> |
| reverse | Whether reverse nodes or not | boolean | false |
| mode | By sending `alternate` the timeline will distribute the nodes to the left and right | `left` \| `alternate` \| `right` | - |
### Timeline.Item
@ -41,6 +41,6 @@ Node of timeline
| Property | Description | Type | Default |
| --- | --- | --- | --- |
| color | Set the circle's color to `blue`, `red`, `green`, `gray` or other custom colors | string | `blue` |
| dot | Customize timeline dot | string\|ReactNode | - |
| dot | Customize timeline dot | string \| ReactNode | - |
| position | Customize node position | `left` \| `right` | - |
| label | Set the label | ReactNode | - |

16
components/timeline/index.zh-CN.md
View File

@ -30,8 +30,8 @@ cover: https://gw.alipayobjects.com/zos/antfincdn/vJmo00mmgR/Timeline.svg
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| pending | 指定最后一个幽灵节点是否存在或内容 | boolean\|string\|ReactNode | false |
| pendingDot | 当最后一个幽灵节点存在時，指定其时间图点 | string\|ReactNode | `<LoadingOutlined />` |
| pending | 指定最后一个幽灵节点是否存在或内容 | boolean \| string \| ReactNode | false |
| pendingDot | 当最后一个幽灵节点存在時，指定其时间图点 | string \| ReactNode | &lt;LoadingOutlined /> |
| reverse | 节点排序 | boolean | false |
| mode | 通过设置 `mode` 可以改变时间轴和内容的相对位置 | `left` \| `alternate` \| `right` | - |
@ -39,9 +39,9 @@ cover: https://gw.alipayobjects.com/zos/antfincdn/vJmo00mmgR/Timeline.svg
时间轴的每一个节点。
| 参数 | 说明 | 类型 | 默认值 |
| -------- | ----------------------------------------------------- | ----------------- | ------ |
| color | 指定圆圈颜色 `blue, red, green, gray`，或自定义的色值 | string | `blue` |
| dot | 自定义时间轴点 | string\|ReactNode | - |
| position | 自定义节点位置 | `left` \| `right` | - |
| label | 设置标签 | ReactNode | - |
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| color | 指定圆圈颜色 `blue`, `red`, `green`, `gray`，或自定义的色值 | string | `blue` |
| dot | 自定义时间轴点 | string \| ReactNode | - |
| position | 自定义节点位置 | `left` \| `right` | - |
| label | 设置标签 | ReactNode | - |

16
components/tooltip/index.en-US.md
View File

@ -14,9 +14,9 @@ A simple text popup tip.
## API
| Property | Description | Type | Default |
| -------- | ----------------------------- | ---------------------------------- | ------- |
| title | The text shown in the tooltip | string\|ReactNode\|() => ReactNode | - |
| Property | Description | Type | Default |
| -------- | ----------------------------- | -------------------------------------- | ------- |
| title | The text shown in the tooltip | string \| ReactNode \| () => ReactNode | - |
### Common API
@ -27,18 +27,18 @@ The following APIs are shared by Tooltip, Popconfirm, Popover.
| arrowPointAtCenter | Whether the arrow is pointed at the center of target | boolean | false | |
| autoAdjustOverflow | Whether to adjust popup placement automatically when popup is off screen | boolean | true | |
| defaultVisible | Whether the floating tooltip card is visible by default | boolean | false | |
| color | background color | string | - | 4.3.0 |
| getPopupContainer | The DOM container of the tip, the default behavior is to create a `div` element in `body` | Function(triggerNode) | () => document.body | |
| color | The background color | string | - | 4.3.0 |
| getPopupContainer | The DOM container of the tip, the default behavior is to create a `div` element in `body` | function(triggerNode) | () => document.body | |
| mouseEnterDelay | Delay in seconds, before tooltip is shown on mouse enter | number | 0.1 | |
| mouseLeaveDelay | Delay in seconds, before tooltip is hidden on mouse leave | number | 0.1 | |
| overlayClassName | Class name of the tooltip card | string | - | |
| overlayStyle | Style of the tooltip card | object | - | |
| placement | The position of the tooltip relative to the target, which can be one of `top` `left` `right` `bottom` `topLeft` `topRight` `bottomLeft` `bottomRight` `leftTop` `leftBottom` `rightTop` `rightBottom` | string | `top` | |
| trigger | Tooltip trigger mode. Could be multiple by passing an array | `hover` \| `focus` \| `click` \| `contextMenu` \| `Array<string>` | `hover` | |
| trigger | Tooltip trigger mode. Could be multiple by passing an array | `hover` \| `focus` \| `click` \| `contextMenu` \| Array&lt;string> | `hover` | |
| visible | Whether the floating tooltip card is visible or not | boolean | false | |
| onVisibleChange | Callback executed when visibility of the tooltip card is changed | (visible) => void | - | |
| align | this value will be merged into placement's config, please refer to the settings [rc-tooltip](https://github.com/react-component/tooltip) | object | - | |
| destroyTooltipOnHide | whether destroy tooltip when hidden, parent container of tooltip will be destroyed when `keepParent` is `false` | boolean \| { keepParent?: boolean } | false | |
| align | This value will be merged into placement's config, please refer to the settings [rc-tooltip](https://github.com/react-component/tooltip) | object | - | |
| destroyTooltipOnHide | Whether destroy tooltip when hidden, parent container of tooltip will be destroyed when `keepParent` is false | boolean \| { keepParent?: boolean } | false | |
## Note

10
components/tooltip/index.zh-CN.md
View File

@ -16,9 +16,9 @@ cover: https://gw.alipayobjects.com/zos/alicdn/Vyyeu8jq2/Tooltp.svg
## API
| 参数 | 说明 | 类型 | 默认值 |
| ----- | -------- | ---------------------------------- | ------ |
| title | 提示文字 | string\|ReactNode\|() => ReactNode | - |
| 参数 | 说明 | 类型 | 默认值 |
| ----- | -------- | -------------------------------------- | ------ |
| title | 提示文字 | string \| ReactNode \| () => ReactNode | - |
### 共同的 API
@ -30,13 +30,13 @@ cover: https://gw.alipayobjects.com/zos/alicdn/Vyyeu8jq2/Tooltp.svg
| autoAdjustOverflow | 气泡被遮挡时自动调整位置 | boolean | true | |
| defaultVisible | 默认是否显隐 | boolean | false | |
| color | 背景颜色 | string | - | 4.3.0 |
| getPopupContainer | 浮层渲染父节点，默认渲染到 body 上 | Function(triggerNode) | () => document.body | |
| getPopupContainer | 浮层渲染父节点，默认渲染到 body 上 | function(triggerNode) | () => document.body | |
| mouseEnterDelay | 鼠标移入后延时多少才显示 Tooltip，单位：秒 | number | 0.1 | |
| mouseLeaveDelay | 鼠标移出后延时多少才隐藏 Tooltip，单位：秒 | number | 0.1 | |
| overlayClassName | 卡片类名 | string | - | |
| overlayStyle | 卡片样式 | object | - | |
| placement | 气泡框位置，可选 `top` `left` `right` `bottom` `topLeft` `topRight` `bottomLeft` `bottomRight` `leftTop` `leftBottom` `rightTop` `rightBottom` | string | `top` | |
| trigger | 触发行为，可选 `hover/focus/click/contextMenu`，可使用数组设置多个触发行为 | string \| string[] | `hover` | |
| trigger | 触发行为，可选 `hover` \| `focus` \| `click` \| `contextMenu`，可使用数组设置多个触发行为 | string \| string[] | `hover` | |
| visible | 用于手动控制浮层显隐 | boolean | false | |
| onVisibleChange | 显示隐藏的回调 | (visible) => void | - | |
| align | 该值将合并到 placement 的配置中，设置参考 [rc-tooltip](https://github.com/react-component/tooltip) | object | - | |

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

@ -19,28 +19,28 @@ Almost anything can be represented in a tree structure. Examples include directo
| --- | --- | --- | --- | --- |
| autoExpandParent | Whether to automatically expand a parent treeNode | boolean | true | |
| blockNode | Whether treeNode fill remaining horizontal space | boolean | false | |
| checkable | Adds a `Checkbox` before the treeNodes | boolean | false | |
| 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\[]} | \[] | |
| checkable | Add a Checkbox before the treeNodes | boolean | false | |
| 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 | |
| defaultCheckedKeys | Specifies the keys of the default checked treeNodes | string\[] | \[] | |
| defaultExpandAll | Whether to expand all treeNodes by default | boolean | false | |
| defaultExpandedKeys | Specify the keys of the default expanded treeNodes | string\[] | \[] | |
| defaultExpandParent | auto expand parent treeNodes when init | bool | true | |
| defaultExpandParent | If auto expand parent treeNodes when init | boolean | true | |
| defaultSelectedKeys | Specifies the keys of the default selected treeNodes | string\[] | \[] | |
| disabled | whether disabled the tree | bool | false | |
| disabled | Whether disabled the tree | boolean | false | |
| draggable | Specifies whether this Tree is draggable (IE > 8) | boolean | false | |
| expandedKeys | (Controlled) Specifies the keys of the expanded treeNodes | string\[] | \[] | |
| 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) | - | |
| loadedKeys | (Controlled) Set loaded tree nodes. Need work with `loadData` | string\[] | \[] | |
| multiple | Allows selecting multiple treeNodes | boolean | false | |
| selectable | whether can be selected | boolean | true | |
| selectable | Whether can be selected | boolean | true | |
| selectedKeys | (Controlled) Specifies the keys of the selected treeNodes | string\[] | - | |
| 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 | |
| switcherIcon | customize collapse/expand icon of tree node | ReactNode | - | |
| showLine | Shows a connecting line | booleanboolean\|{showLeafIcon: boolean} | false | |
| treeData | treeNodes data Array, if set it then you need not to construct children TreeNode. (key should be unique across the whole array) | array\<{ key, title, children, \[disabled, selectable] }> | - | |
| virtual | Disable virtual scroll when set to `false` | boolean | true | 4.1.0 |
| 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 | |
| switcherIcon | Customize collapse/expand icon of tree node | ReactNode | - | |
| showLine | Shows a connecting line | boolean \| {showLeafIcon: boolean} | false | |
| treeData | The treeNodes data Array, if set it then you need not to construct children TreeNode. (key should be unique across the whole array) | array&lt;{ key, title, children, \[disabled, selectable] }> | - | |
| virtual | Disable virtual scroll when set to false | boolean | true | 4.1.0 |
| onCheck | Callback function for when the onCheck event occurs | function(checkedKeys, e:{checked: bool, checkedNodes, node, event, halfCheckedKeys}) | - | |
| onDragEnd | Callback function for when the onDragEnd event occurs | function({event, node}) | - | |
| onDragEnter | Callback function for when the onDragEnter event occurs | function({event, node, expandedKeys}) | - | |
@ -52,7 +52,7 @@ Almost anything can be represented in a tree structure. Examples include directo
| onLoad | Callback function for when a treeNode is loaded | function(loadedKeys, {event, node}) | - | |
| onRightClick | Callback function for when the user right clicks a treeNode | function({event, node}) | - | |
| onSelect | Callback function for when the user clicks a treeNode | function(selectedKeys, e:{selected: bool, selectedNodes, node, event}) | - | |
| icon | customize treeNode icon. | ReactNode \| (props) => ReactNode | - | |
| icon | Customize treeNode icon | ReactNode \| (props) => ReactNode | - | |
### TreeNode props
@ -61,17 +61,17 @@ Almost anything can be represented in a tree structure. Examples include directo
| checkable | When Tree is checkable, set TreeNode display Checkbox or not | boolean | - |
| disableCheckbox | Disables the checkbox of the treeNode | boolean | false | |
| disabled | Disables the treeNode | boolean | false | |
| icon | customize icon. When you pass component, whose render will receive full TreeNode props as component props | ReactNode \| (props) => ReactNode | - | |
| icon | Customize icon. When you pass component, whose render will receive full TreeNode props as component props | ReactNode \| (props) => ReactNode | - | |
| isLeaf | Determines if this is a leaf node(effective when `loadData` is specified) | boolean | false | |
| 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 | |
| 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) | |
| selectable | Set whether the treeNode can be selected | boolean | true | |
| title | Title | string\|ReactNode | `---` | |
| title | Title | string \| ReactNode | `---` | |
### DirectoryTree props
| Property | Description | Type | Default |
| --- | --- | --- | --- |
| expandAction | Directory open logic, optional `false` `'click'` `'doubleClick'` | string | `click` |
| expandAction | Directory open logic, optional: false \| `click` \| `doubleClick` | string \| boolean | `click` |
## Note

20
components/tree/index.zh-CN.md
View File

@ -26,9 +26,9 @@ cover: https://gw.alipayobjects.com/zos/alicdn/Xh-oWqg9k/Tree.svg
| defaultCheckedKeys | 默认选中复选框的树节点 | string\[] | \[] | |
| defaultExpandAll | 默认展开所有树节点 | boolean | false | |
| defaultExpandedKeys | 默认展开指定的树节点 | string\[] | \[] | |
| defaultExpandParent | 默认展开父节点 | bool | true | |
| defaultExpandParent | 默认展开父节点 | boolean | true | |
| defaultSelectedKeys | 默认选中的树节点 | string\[] | \[] | |
| disabled | 将树禁用 | bool | false | |
| disabled | 将树禁用 | boolean | false | |
| draggable | 设置节点可拖拽（IE>8） | boolean | false | |
| expandedKeys | （受控）展开指定的树节点 | string\[] | \[] | |
| filterTreeNode | 按需筛选树节点（高亮），返回 true | function(node) | - | |
@ -39,9 +39,9 @@ cover: https://gw.alipayobjects.com/zos/alicdn/Xh-oWqg9k/Tree.svg
| selectedKeys | （受控）设置选中的树节点 | string\[] | - | |
| showIcon | 是否展示 TreeNode title 前的图标，没有默认样式，如设置为 true，需要自行定义图标相关样式 | boolean | false | |
| switcherIcon | 自定义树节点的展开/折叠图标 | ReactNode | - |
| showLine | 是否展示连接线 | boolean\|{showLeafIcon: boolean} | false | |
| treeData | treeNodes 数据，如果设置则不需要手动构造 TreeNode 节点（key 在整个树范围内唯一） | array\<{key, title, children, \[disabled, selectable]}> | - | |
| virtual | 设置 `false` 时关闭虚拟滚动 | boolean | true | 4.1.0 |
| showLine | 是否展示连接线 | boolean \| {showLeafIcon: boolean} | false | |
| treeData | treeNodes 数据，如果设置则不需要手动构造 TreeNode 节点（key 在整个树范围内唯一） | array&lt;{key, title, children, \[disabled, selectable]}> | - | |
| virtual | 设置 false 时关闭虚拟滚动 | boolean | true | 4.1.0 |
| onCheck | 点击复选框触发 | function(checkedKeys, e:{checked: bool, checkedNodes, node, event, halfCheckedKeys}) | - | |
| onDragEnd | dragend 触发时调用 | function({event, node}) | - | |
| onDragEnter | dragenter 触发时调用 | function({event, node, expandedKeys}) | - | |
@ -64,15 +64,15 @@ cover: https://gw.alipayobjects.com/zos/alicdn/Xh-oWqg9k/Tree.svg
| disabled | 禁掉响应 | boolean | false |
| icon | 自定义图标。可接收组件，props 为当前节点 props | ReactNode \| (props) => ReactNode | - | |
| isLeaf | 设置为叶子节点(设置了`loadData`时有效) | boolean | false |
| key | 被树的 (default)ExpandedKeys / (default)CheckedKeys / (default)SelectedKeys 属性所用。注意：整个树范围内的所有节点的 key 值不能重复！ | string | 内部计算出的节点位置 |
| key | 被树的 (default)ExpandedKeys / (default)CheckedKeys / (default)SelectedKeys 属性所用。注意：整个树范围内的所有节点的 key 值不能重复！ | string | (内部计算出的节点位置) |
| selectable | 设置节点是否可被选中 | boolean | true |
| title | 标题 | string\|ReactNode | `---` |
| title | 标题 | string \| ReactNode | `---` |
### DirectoryTree props
| 参数 | 说明 | 类型 | 默认值 |
| ------------ | ---------------------------------------------------- | ------ | ------- |
| expandAction | 目录展开逻辑，可选 `false` `'click'` `'doubleClick'` | string | `click` |
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| expandAction | 目录展开逻辑，可选：false \| `click` \| `doubleClick` | string \| boolean | `click` |
## 注意