mirror of
https://github.com/ant-design/ant-design.git
synced 2025-06-06 00:44:17 +08:00
docs: format api (#29537)
This commit is contained in:
parent
d719f16487
commit
e5d908a078
@ -30,7 +30,7 @@ Alert component for feedback.
|
||||
|
||||
### Alert.ErrorBoundary
|
||||
|
||||
| Property | Description | Type | Default | Version |
|
||||
| ----------- | -------------------------------- | --------- | ----------------- | ------- |
|
||||
| description | Custom error description to show | ReactNode | {{ error stack }} | |
|
||||
| message | Custom error message to show | ReactNode | {{ error }} | |
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| description | Custom error description to show | ReactNode | {{ error stack }} | |
|
||||
| message | Custom error message to show | ReactNode | {{ error }} | |
|
||||
|
@ -30,8 +30,8 @@ For displaying anchor hyperlinks on page and jumping between them.
|
||||
|
||||
### Link Props
|
||||
|
||||
| Property | Description | Type | Default | Version |
|
||||
| -------- | ----------------------------------------- | --------- | ------- | ------- |
|
||||
| href | The target of hyperlink | string | | |
|
||||
| target | Specifies where to display the linked URL | string | | |
|
||||
| title | The content of hyperlink | ReactNode | | |
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| href | The target of hyperlink | string | | |
|
||||
| target | Specifies where to display the linked URL | string | | |
|
||||
| title | The content of hyperlink | ReactNode | | |
|
||||
|
@ -31,8 +31,8 @@ cover: https://gw.alipayobjects.com/zos/alicdn/_1-C1JwsC/Anchor.svg
|
||||
|
||||
### Link Props
|
||||
|
||||
| 成员 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| ------ | -------------------------------- | --------- | ------ | ---- |
|
||||
| href | 锚点链接 | string | - | |
|
||||
| target | 该属性指定在何处显示链接的资源。 | string | - | |
|
||||
| title | 文字内容 | ReactNode | - | |
|
||||
| 成员 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| href | 锚点链接 | string | - | |
|
||||
| target | 该属性指定在何处显示链接的资源。 | string | - | |
|
||||
| title | 文字内容 | ReactNode | - | |
|
||||
|
@ -42,10 +42,10 @@ When there is a need for autocomplete functionality.
|
||||
|
||||
## Methods
|
||||
|
||||
| Name | Description | Version |
|
||||
| ------- | ------------ | ------- |
|
||||
| blur() | Remove focus | |
|
||||
| focus() | Get focus | |
|
||||
| Name | Description | Version |
|
||||
| --- | --- | --- |
|
||||
| blur() | Remove focus | |
|
||||
| focus() | Get focus | |
|
||||
|
||||
## FAQ
|
||||
|
||||
|
@ -50,10 +50,10 @@ cover: https://gw.alipayobjects.com/zos/alicdn/qtJm4yt45/AutoComplete.svg
|
||||
|
||||
## 方法
|
||||
|
||||
| 名称 | 描述 | 版本 |
|
||||
| ------- | -------- | ---- |
|
||||
| blur() | 移除焦点 | |
|
||||
| focus() | 获取焦点 | |
|
||||
| 名称 | 描述 | 版本 |
|
||||
| --- | --- | --- |
|
||||
| blur() | 移除焦点 | |
|
||||
| focus() | 获取焦点 | |
|
||||
|
||||
## FAQ
|
||||
|
||||
|
@ -36,9 +36,9 @@ A breadcrumb displays the current location within a hierarchy. It allows going b
|
||||
|
||||
### Breadcrumb.Separator
|
||||
|
||||
| Property | Description | Type | Default | Version |
|
||||
| -------- | ---------------- | --------- | ------- | ------- |
|
||||
| children | Custom separator | ReactNode | `/` | |
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| children | Custom separator | ReactNode | `/` | |
|
||||
|
||||
> When using `Breadcrumb.Separator`,its parent component must be set to `separator=""`, otherwise the default separator of the parent component will appear.
|
||||
|
||||
|
@ -37,9 +37,9 @@ cover: https://gw.alipayobjects.com/zos/alicdn/9Ltop8JwH/Breadcrumb.svg
|
||||
|
||||
### Breadcrumb.Separator
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| -------- | -------------- | --------- | ------ | ---- |
|
||||
| children | 要显示的分隔符 | ReactNode | `/` | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| children | 要显示的分隔符 | ReactNode | `/` | |
|
||||
|
||||
> 注意:在使用 `Breadcrumb.Separator` 时,其父组件的分隔符必须设置为 `separator=""`,否则会出现父组件默认的分隔符。
|
||||
|
||||
|
@ -42,18 +42,18 @@ A card can be used to display content related to a single subject. The content c
|
||||
|
||||
### Card.Grid
|
||||
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --------- | ------------------------------- | ------------- | ------- | ------- |
|
||||
| className | The className of container | string | - | |
|
||||
| hoverable | Lift up when hovering card grid | boolean | true | |
|
||||
| style | The style object of container | CSSProperties | - | |
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| className | The className of container | string | - | |
|
||||
| hoverable | Lift up when hovering card grid | boolean | true | |
|
||||
| style | The style object of container | CSSProperties | - | |
|
||||
|
||||
### Card.Meta
|
||||
|
||||
| Property | Description | Type | Default | Version |
|
||||
| ----------- | ----------------------------- | ------------- | ------- | ------- |
|
||||
| avatar | Avatar or icon | ReactNode | - | |
|
||||
| className | The className of container | string | - | |
|
||||
| description | Description content | ReactNode | - | |
|
||||
| style | The style object of container | CSSProperties | - | |
|
||||
| title | Title content | ReactNode | - | |
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| avatar | Avatar or icon | ReactNode | - | |
|
||||
| className | The className of container | string | - | |
|
||||
| description | Description content | ReactNode | - | |
|
||||
| style | The style object of container | CSSProperties | - | |
|
||||
| title | Title content | ReactNode | - | |
|
||||
|
@ -43,18 +43,18 @@ cover: https://gw.alipayobjects.com/zos/antfincdn/NqXt8DJhky/Card.svg
|
||||
|
||||
### Card.Grid
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --------- | ---------------------- | ------------- | ------ | ---- |
|
||||
| className | 网格容器类名 | string | - | |
|
||||
| hoverable | 鼠标移过时可浮起 | boolean | true | |
|
||||
| style | 定义网格容器类名的样式 | CSSProperties | - | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| className | 网格容器类名 | string | - | |
|
||||
| hoverable | 鼠标移过时可浮起 | boolean | true | |
|
||||
| style | 定义网格容器类名的样式 | CSSProperties | - | |
|
||||
|
||||
### Card.Meta
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| ----------- | ------------------ | ------------- | ------ | ---- |
|
||||
| avatar | 头像/图标 | ReactNode | - | |
|
||||
| className | 容器类名 | string | - | |
|
||||
| description | 描述内容 | ReactNode | - | |
|
||||
| style | 定义容器类名的样式 | CSSProperties | - | |
|
||||
| title | 标题内容 | ReactNode | - | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| avatar | 头像/图标 | ReactNode | - | |
|
||||
| className | 容器类名 | string | - | |
|
||||
| description | 描述内容 | ReactNode | - | |
|
||||
| style | 定义容器类名的样式 | CSSProperties | - | |
|
||||
| title | 标题内容 | ReactNode | - | |
|
||||
|
@ -28,10 +28,10 @@ cover: https://gw.alipayobjects.com/zos/antfincdn/%24C9tmj978R/Carousel.svg
|
||||
|
||||
## 方法
|
||||
|
||||
| 名称 | 描述 |
|
||||
| ------------------------------ | ------------------------------------------------- |
|
||||
| 名称 | 描述 |
|
||||
| --- | --- |
|
||||
| goTo(slideNumber, dontAnimate) | 切换到指定面板, dontAnimate = true 时,不使用动画 |
|
||||
| next() | 切换到下一面板 |
|
||||
| prev() | 切换到上一面板 |
|
||||
| next() | 切换到下一面板 |
|
||||
| prev() | 切换到上一面板 |
|
||||
|
||||
更多 API 可参考:<https://react-slick.neostack.com/docs/api>
|
||||
|
@ -72,7 +72,7 @@ interface Option {
|
||||
|
||||
## Methods
|
||||
|
||||
| Name | Description | Version |
|
||||
| ------- | ------------ | ------- |
|
||||
| blur() | Remove focus | |
|
||||
| focus() | Get focus | |
|
||||
| Name | Description | Version |
|
||||
| --- | --- | --- |
|
||||
| blur() | Remove focus | |
|
||||
| focus() | Get focus | |
|
||||
|
@ -75,9 +75,9 @@ interface Option {
|
||||
|
||||
## 方法
|
||||
|
||||
| 名称 | 描述 | 版本 |
|
||||
| ------- | -------- | ---- |
|
||||
| blur() | 移除焦点 | |
|
||||
| focus() | 获取焦点 | |
|
||||
| 名称 | 描述 | 版本 |
|
||||
| --- | --- | --- |
|
||||
| blur() | 移除焦点 | |
|
||||
| focus() | 获取焦点 | |
|
||||
|
||||
> 注意,如果需要获得中国省市区数据,可以参考 [china-division](https://gist.github.com/afc163/7582f35654fd03d5be7009444345ea17)。
|
||||
|
@ -42,7 +42,7 @@ Checkbox component.
|
||||
|
||||
#### Checkbox
|
||||
|
||||
| Name | Description | Version |
|
||||
| ------- | ------------ | ------- |
|
||||
| blur() | Remove focus | |
|
||||
| focus() | Get focus | |
|
||||
| Name | Description | Version |
|
||||
| --- | --- | --- |
|
||||
| blur() | Remove focus | |
|
||||
| focus() | Get focus | |
|
||||
|
@ -19,14 +19,14 @@ cover: https://gw.alipayobjects.com/zos/alicdn/8nbVbHEm_/CheckBox.svg
|
||||
|
||||
#### Checkbox
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| -------------- | --------------------------------------- | ----------------- | ------ | ---- |
|
||||
| autoFocus | 自动获取焦点 | boolean | false | |
|
||||
| checked | 指定当前是否选中 | boolean | false | |
|
||||
| defaultChecked | 初始是否选中 | boolean | false | |
|
||||
| disabled | 失效状态 | boolean | false | |
|
||||
| indeterminate | 设置 indeterminate 状态,只负责样式控制 | boolean | false | |
|
||||
| onChange | 变化时回调函数 | function(e:Event) | - | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| autoFocus | 自动获取焦点 | boolean | false | |
|
||||
| checked | 指定当前是否选中 | boolean | false | |
|
||||
| defaultChecked | 初始是否选中 | boolean | false | |
|
||||
| disabled | 失效状态 | boolean | false | |
|
||||
| indeterminate | 设置 indeterminate 状态,只负责样式控制 | boolean | false | |
|
||||
| onChange | 变化时回调函数 | function(e:Event) | - | |
|
||||
|
||||
#### Checkbox Group
|
||||
|
||||
@ -53,7 +53,7 @@ interface Option {
|
||||
|
||||
#### Checkbox
|
||||
|
||||
| 名称 | 描述 | 版本 |
|
||||
| ------- | -------- | ---- |
|
||||
| blur() | 移除焦点 | |
|
||||
| focus() | 获取焦点 | |
|
||||
| 名称 | 描述 | 版本 |
|
||||
| --- | --- | --- |
|
||||
| blur() | 移除焦点 | |
|
||||
| focus() | 获取焦点 | |
|
||||
|
@ -33,11 +33,11 @@ cover: https://gw.alipayobjects.com/zos/alicdn/IxH16B9RD/Collapse.svg
|
||||
|
||||
### Collapse.Panel
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| ----------- | ------------------------------ | ---------------------- | ------ | ----- |
|
||||
| collapsible | 是否可折叠或指定可折叠触发区域 | `header` \| `disabled` | - | 4.9.0 |
|
||||
| extra | 自定义渲染每个面板右上角的内容 | ReactNode | - | |
|
||||
| forceRender | 被隐藏时是否渲染 DOM 结构 | boolean | false | |
|
||||
| header | 面板头内容 | ReactNode | - | |
|
||||
| key | 对应 activeKey | string \| number | - | |
|
||||
| showArrow | 是否展示当前面板上的箭头 | boolean | true | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| collapsible | 是否可折叠或指定可折叠触发区域 | `header` \| `disabled` | - | 4.9.0 |
|
||||
| extra | 自定义渲染每个面板右上角的内容 | ReactNode | - | |
|
||||
| forceRender | 被隐藏时是否渲染 DOM 结构 | boolean | false | |
|
||||
| header | 面板头内容 | ReactNode | - | |
|
||||
| key | 对应 activeKey | string \| number | - | |
|
||||
| showArrow | 是否展示当前面板上的箭头 | boolean | true | |
|
||||
|
@ -77,10 +77,10 @@ The following APIs are shared by DatePicker, RangePicker.
|
||||
|
||||
### Common Methods
|
||||
|
||||
| Name | Description | Version |
|
||||
| ------- | ------------ | ------- |
|
||||
| blur() | Remove focus | |
|
||||
| focus() | Get focus | |
|
||||
| Name | Description | Version |
|
||||
| --- | --- | --- |
|
||||
| blur() | Remove focus | |
|
||||
| focus() | Get focus | |
|
||||
|
||||
### DatePicker
|
||||
|
||||
|
@ -78,10 +78,10 @@ import locale from 'antd/lib/locale/zh_CN';
|
||||
|
||||
### 共同的方法
|
||||
|
||||
| 名称 | 描述 | 版本 |
|
||||
| ------- | -------- | ---- |
|
||||
| blur() | 移除焦点 | |
|
||||
| focus() | 获取焦点 | |
|
||||
| 名称 | 描述 | 版本 |
|
||||
| --- | --- | --- |
|
||||
| blur() | 移除焦点 | |
|
||||
| focus() | 获取焦点 | |
|
||||
|
||||
### DatePicker
|
||||
|
||||
|
@ -30,11 +30,11 @@ Commonly displayed on the details page.
|
||||
|
||||
### DescriptionItem
|
||||
|
||||
| Property | Description | Type | Default | Version |
|
||||
| ------------ | ------------------------------ | ------------- | ------- | ------- |
|
||||
| contentStyle | Customize label style | CSSProperties | - | 4.9.0 |
|
||||
| label | The description of the content | ReactNode | - | |
|
||||
| labelStyle | Customize label style | CSSProperties | - | 4.9.0 |
|
||||
| span | The number of columns included | number | 1 | |
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| contentStyle | Customize label style | CSSProperties | - | 4.9.0 |
|
||||
| label | The description of the content | ReactNode | - | |
|
||||
| labelStyle | Customize label style | CSSProperties | - | 4.9.0 |
|
||||
| span | The number of columns included | number | 1 | |
|
||||
|
||||
> The number of span Description.Item. Span={2} takes up the width of two DescriptionItems. When both `style` and `labelStyle`(or `contentStyle`) configured, both of them will work. And next one will overwrite first when conflict.
|
||||
|
@ -31,11 +31,11 @@ cover: https://gw.alipayobjects.com/zos/alicdn/MjtG9_FOI/Descriptions.svg
|
||||
|
||||
### DescriptionItem
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| ------------ | -------------- | ------------- | ------ | ----- |
|
||||
| contentStyle | 自定义内容样式 | CSSProperties | - | 4.9.0 |
|
||||
| label | 内容的描述 | ReactNode | - | |
|
||||
| labelStyle | 自定义标签样式 | CSSProperties | - | 4.9.0 |
|
||||
| span | 包含列的数量 | number | 1 | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| contentStyle | 自定义内容样式 | CSSProperties | - | 4.9.0 |
|
||||
| label | 内容的描述 | ReactNode | - | |
|
||||
| labelStyle | 自定义标签样式 | CSSProperties | - | 4.9.0 |
|
||||
| span | 包含列的数量 | number | 1 | |
|
||||
|
||||
> span 是 Description.Item 的数量。 span={2} 会占用两个 DescriptionItem 的宽度。当同时配置 `style` 和 `labelStyle`(或 `contentStyle`)时,两者会同时作用。样式冲突时,后者会覆盖前者。
|
||||
|
@ -15,11 +15,11 @@ cover: https://gw.alipayobjects.com/zos/alicdn/5swjECahe/Divider.svg
|
||||
|
||||
## API
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| ----------- | -------------------------- | ----------------------------- | ------------ | ----- |
|
||||
| className | 分割线样式类 | string | - | |
|
||||
| dashed | 是否虚线 | boolean | false | |
|
||||
| orientation | 分割线标题的位置 | `left` \| `right` \| `center` | `center` | |
|
||||
| plain | 文字是否显示为普通正文样式 | boolean | false | 4.2.0 |
|
||||
| style | 分割线样式对象 | CSSProperties | - | |
|
||||
| type | 水平还是垂直类型 | `horizontal` \| `vertical` | `horizontal` | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| className | 分割线样式类 | string | - | |
|
||||
| dashed | 是否虚线 | boolean | false | |
|
||||
| orientation | 分割线标题的位置 | `left` \| `right` \| `center` | `center` | |
|
||||
| plain | 文字是否显示为普通正文样式 | boolean | false | 4.2.0 |
|
||||
| style | 分割线样式对象 | CSSProperties | - | |
|
||||
| type | 水平还是垂直类型 | `horizontal` \| `vertical` | `horizontal` | |
|
||||
|
@ -22,10 +22,10 @@ A Drawer is a panel that is typically overlaid on top of a page and slides in fr
|
||||
| --- | --- | --- | --- | --- |
|
||||
| afterVisibleChange | Callback after the animation ends when switching drawers | function(visible) | - | |
|
||||
| bodyStyle | Style of the drawer content part | object | - | |
|
||||
| contentWrapperStyle | Style of the drawer wrapper of content part | CSSProperties | - | |
|
||||
| className | The class name of the container of the Drawer dialog | string | - | |
|
||||
| closable | Whether a close (x) button is visible on top right of the Drawer dialog or not | boolean | true | |
|
||||
| closeIcon | Custom close icon | ReactNode | <CloseOutlined /> | |
|
||||
| contentWrapperStyle | Style of the drawer wrapper of content part | CSSProperties | - | |
|
||||
| destroyOnClose | Whether to unmount child components on closing drawer or not | boolean | false | |
|
||||
| drawerStyle | Style of the popup layer element | object | - | |
|
||||
| footer | The footer for Drawer | ReactNode | - | |
|
||||
|
@ -21,10 +21,10 @@ cover: https://gw.alipayobjects.com/zos/alicdn/7z8NJQhFb/Drawer.svg
|
||||
| --- | --- | --- | --- | --- |
|
||||
| afterVisibleChange | 切换抽屉时动画结束后的回调 | function(visible) | - | |
|
||||
| bodyStyle | 可用于设置 Drawer 内容部分的样式 | CSSProperties | - | |
|
||||
| contentWrapperStyle | 可用于设置 Drawer 包裹内容部分的样式 | CSSProperties | - | |
|
||||
| className | 对话框外层容器的类名 | string | - | |
|
||||
| closable | 是否显示右上角的关闭按钮 | boolean | true | |
|
||||
| closeIcon | 自定义关闭图标 | ReactNode | <CloseOutlined /> | |
|
||||
| contentWrapperStyle | 可用于设置 Drawer 包裹内容部分的样式 | CSSProperties | - | |
|
||||
| destroyOnClose | 关闭时销毁 Drawer 里的子元素 | boolean | false | |
|
||||
| drawerStyle | 用于设置 Drawer 弹出层的样式 | CSSProperties | - | |
|
||||
| footer | 抽屉的页脚 | ReactNode | - | |
|
||||
|
@ -203,9 +203,9 @@ Some operator functions in render form of Form.List.
|
||||
|
||||
New in 4.7.0. Show error messages, should only work with `rules` of Form.List. See [example](#components-form-demo-dynamic-form-item).
|
||||
|
||||
| Property | Description | Type | Default |
|
||||
| -------- | ----------- | ------------ | ------- |
|
||||
| errors | Error list | ReactNode\[] | - |
|
||||
| Property | Description | Type | Default |
|
||||
| --- | --- | --- | --- |
|
||||
| errors | Error list | ReactNode\[] | - |
|
||||
|
||||
## Form.Provider
|
||||
|
||||
@ -286,13 +286,13 @@ validateFields()
|
||||
|
||||
#### FieldData
|
||||
|
||||
| Name | Description | Type |
|
||||
| ---------- | ------------------------ | ------------------------ |
|
||||
| errors | Error messages | string\[] |
|
||||
| name | Field name path | [NamePath](#NamePath)\[] |
|
||||
| touched | Whether is operated | boolean |
|
||||
| validating | Whether is in validating | boolean |
|
||||
| value | Field value | any |
|
||||
| Name | Description | Type |
|
||||
| --- | --- | --- |
|
||||
| errors | Error messages | string\[] |
|
||||
| name | Field name path | [NamePath](#NamePath)\[] |
|
||||
| touched | Whether is operated | boolean |
|
||||
| validating | Whether is in validating | boolean |
|
||||
| value | Field value | any |
|
||||
|
||||
#### Rule
|
||||
|
||||
@ -304,7 +304,9 @@ type Rule = RuleConfig | ((form: FormInstance) => RuleConfig);
|
||||
|
||||
| Name | Description | Type |
|
||||
| --- | --- | --- |
|
||||
| defaultField | Validate rule for all array elements, valid when `type` is `array` | [rule](#Rule) |
|
||||
| enum | Match enum value. You need to set `type` to `enum` to enable this | any\[] |
|
||||
| fields | Validate rule for child elements, valid when `type` is `array` or `object` | Record<string, [rule](#Rule)> |
|
||||
| len | Length of string, number, array | number |
|
||||
| max | `type` required: max length of `string`, `number`, `array` | number |
|
||||
| message | Error message. Will auto generate by [template](#validateMessages) if not provided | string |
|
||||
@ -316,8 +318,6 @@ type Rule = RuleConfig | ((form: FormInstance) => RuleConfig);
|
||||
| validateTrigger | Set validate trigger event. Must be the sub set of `validateTrigger` in Form.Item | string \| string\[] |
|
||||
| validator | Customize validation rule. Accept Promise as return. See [example](#components-form-demo-register) | ([rule](#Rule), value) => Promise |
|
||||
| whitespace | Failed if only has whitespace | boolean |
|
||||
| defaultField | Validate rule for all array elements, valid when `type` is `array` | [rule](#Rule) |
|
||||
| fields | Validate rule for child elements, valid when `type` is `array` or `object` | Record<string, [rule](#Rule)> |
|
||||
|
||||
## Migrate to v4
|
||||
|
||||
|
@ -192,19 +192,19 @@ Form 通过增量更新方式,只更新被修改的字段相关组件以达到
|
||||
|
||||
Form.List 渲染表单相关操作函数。
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| ------ | ---------- | -------------------------------------------------- | ------------------ |
|
||||
| add | 新增表单项 | (defaultValue?: any, insertIndex?: number) => void | insertIndex: 4.6.0 |
|
||||
| move | 移动表单项 | (from: number, to: number) => void | - |
|
||||
| remove | 删除表单项 | (index: number \| number\[]) => void | number\[]: 4.5.0 |
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| add | 新增表单项 | (defaultValue?: any, insertIndex?: number) => void | insertIndex: 4.6.0 |
|
||||
| move | 移动表单项 | (from: number, to: number) => void | - |
|
||||
| remove | 删除表单项 | (index: number \| number\[]) => void | number\[]: 4.5.0 |
|
||||
|
||||
## Form.ErrorList
|
||||
|
||||
4.7.0 新增。错误展示组件,仅限配合 Form.List 的 rules 一同使用。参考[示例](#components-form-demo-dynamic-form-item)。
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| ------ | -------- | ------------ | ------ |
|
||||
| errors | 错误列表 | ReactNode\[] | - |
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| errors | 错误列表 | ReactNode\[] | - |
|
||||
|
||||
## Form.Provider
|
||||
|
||||
@ -285,13 +285,13 @@ validateFields()
|
||||
|
||||
#### FieldData
|
||||
|
||||
| 名称 | 说明 | 类型 |
|
||||
| ---------- | ---------------- | ------------------------ |
|
||||
| errors | 错误信息 | string\[] |
|
||||
| name | 字段名称 | [NamePath](#NamePath)\[] |
|
||||
| touched | 是否被用户操作过 | boolean |
|
||||
| validating | 是否正在校验 | boolean |
|
||||
| value | 字段对应值 | any |
|
||||
| 名称 | 说明 | 类型 |
|
||||
| --- | --- | --- |
|
||||
| errors | 错误信息 | string\[] |
|
||||
| name | 字段名称 | [NamePath](#NamePath)\[] |
|
||||
| touched | 是否被用户操作过 | boolean |
|
||||
| validating | 是否正在校验 | boolean |
|
||||
| value | 字段对应值 | any |
|
||||
|
||||
#### Rule
|
||||
|
||||
@ -303,7 +303,9 @@ type Rule = RuleConfig | ((form: FormInstance) => RuleConfig);
|
||||
|
||||
| 名称 | 说明 | 类型 |
|
||||
| --- | --- | --- |
|
||||
| defaultField | 仅在 `type` 为 `array` 类型时有效,用于指定数组元素的校验规则 | [rule](#Rule) |
|
||||
| enum | 是否匹配枚举中的值(需要将 `type` 设置为 `enum`) | any\[] |
|
||||
| fields | 仅在 `type` 为 `array` 或 `object` 类型时有效,用于指定子元素的校验规则 | Record<string, [rule](#Rule)> |
|
||||
| len | string 类型时为字符串长度;number 类型时为确定数字; array 类型时为数组长度 | number |
|
||||
| max | 必须设置 `type`:string 类型为字符串最大长度;number 类型时为最大值;array 类型时为数组最大长度 | number |
|
||||
| message | 错误信息,不设置时会通过[模板](#validateMessages)自动生成 | string |
|
||||
@ -315,8 +317,6 @@ type Rule = RuleConfig | ((form: FormInstance) => RuleConfig);
|
||||
| validateTrigger | 设置触发验证时机,必须是 Form.Item 的 `validateTrigger` 的子集 | string \| string\[] |
|
||||
| validator | 自定义校验,接收 Promise 作为返回值。[示例](#components-form-demo-register)参考 | ([rule](#Rule), value) => Promise |
|
||||
| whitespace | 如果字段仅包含空格则校验不通过 | boolean |
|
||||
| defaultField | 仅在 `type` 为 `array` 类型时有效,用于指定数组元素的校验规则 | [rule](#Rule) |
|
||||
| fields | 仅在 `type` 为 `array` 或 `object` 类型时有效,用于指定子元素的校验规则 | Record<string, [rule](#Rule)> |
|
||||
|
||||
## 从 v3 升级到 v4
|
||||
|
||||
|
@ -14,7 +14,7 @@ npm install --save @ant-design/icons
|
||||
|
||||
## List of icons
|
||||
|
||||
```__react
|
||||
```_\_react
|
||||
import IconDisplay from 'site/theme/template/IconDisplay';
|
||||
ReactDOM.render(<IconDisplay />, mountNode);
|
||||
```
|
||||
|
@ -19,7 +19,7 @@ npm install --save @ant-design/icons
|
||||
|
||||
## 图标列表
|
||||
|
||||
```__react
|
||||
```_\_react
|
||||
import IconDisplay from 'site/theme/template/IconDisplay';
|
||||
ReactDOM.render(<IconDisplay />, mountNode);
|
||||
```
|
||||
@ -148,10 +148,10 @@ ReactDOM.render(<Icon component={MessageSvg} />, mountNode);
|
||||
|
||||
`Icon` 中的 `component` 组件的接受的属性如下:
|
||||
|
||||
| 字段 | 说明 | 类型 | 只读值 | 版本 |
|
||||
| --------- | ----------------------- | ---------------- | -------------- | ---- |
|
||||
| className | 计算后的 `svg` 类名 | string | - | |
|
||||
| fill | `svg` 元素填充的颜色 | string | `currentColor` | |
|
||||
| height | `svg` 元素高度 | string \| number | `1em` | |
|
||||
| style | 计算后的 `svg` 元素样式 | CSSProperties | - | |
|
||||
| width | `svg` 元素宽度 | string \| number | `1em` | |
|
||||
| 字段 | 说明 | 类型 | 只读值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| className | 计算后的 `svg` 类名 | string | - | |
|
||||
| fill | `svg` 元素填充的颜色 | string | `currentColor` | |
|
||||
| height | `svg` 元素高度 | string \| number | `1em` | |
|
||||
| style | 计算后的 `svg` 元素样式 | CSSProperties | - | |
|
||||
| width | `svg` 元素宽度 | string \| number | `1em` | |
|
||||
|
@ -37,10 +37,10 @@ When a numeric value needs to be provided.
|
||||
|
||||
## Methods
|
||||
|
||||
| Name | Description |
|
||||
| ------- | ------------ |
|
||||
| blur() | Remove focus |
|
||||
| focus() | Get focus |
|
||||
| Name | Description |
|
||||
| --- | --- |
|
||||
| blur() | Remove focus |
|
||||
| focus() | Get focus |
|
||||
|
||||
## Notes
|
||||
|
||||
|
@ -40,9 +40,9 @@ cover: https://gw.alipayobjects.com/zos/alicdn/XOS8qZ0kU/InputNumber.svg
|
||||
|
||||
## 方法
|
||||
|
||||
| 名称 | 描述 |
|
||||
| ------- | -------- |
|
||||
| blur() | 移除焦点 |
|
||||
| 名称 | 描述 |
|
||||
| --- | --- |
|
||||
| blur() | 移除焦点 |
|
||||
| focus() | 获取焦点 |
|
||||
|
||||
## FAQ
|
||||
|
@ -37,24 +37,24 @@ A list can be used to display content related to a single subject. The content c
|
||||
|
||||
Properties for pagination.
|
||||
|
||||
| Property | Description | Type | Default |
|
||||
| -------- | ---------------------------------------- | --------------------------- | -------- |
|
||||
| Property | Description | Type | Default |
|
||||
| --- | --- | --- | --- |
|
||||
| position | The specify the position of `Pagination` | `top` \| `bottom` \| `both` | `bottom` |
|
||||
|
||||
More about pagination, please check [`Pagination`](/components/pagination/).
|
||||
|
||||
### List grid props
|
||||
|
||||
| Property | Description | Type | Default | Version |
|
||||
| -------- | ------------------------ | ------ | ------- | ------- |
|
||||
| column | The column of grid | number | - | |
|
||||
| gutter | The spacing between grid | number | 0 | |
|
||||
| xs | `<576px` column of grid | number | - | |
|
||||
| sm | `≥576px` column of grid | number | - | |
|
||||
| md | `≥768px` column of grid | number | - | |
|
||||
| lg | `≥992px` column of grid | number | - | |
|
||||
| xl | `≥1200px` column of grid | number | - | |
|
||||
| xxl | `≥1600px` column of grid | number | - | |
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| column | The column of grid | number | - | |
|
||||
| gutter | The spacing between grid | number | 0 | |
|
||||
| xs | `<576px` column of grid | number | - | |
|
||||
| sm | `≥576px` column of grid | number | - | |
|
||||
| md | `≥768px` column of grid | number | - | |
|
||||
| lg | `≥992px` column of grid | number | - | |
|
||||
| xl | `≥1200px` column of grid | number | - | |
|
||||
| xxl | `≥1600px` column of grid | number | - | |
|
||||
|
||||
### List.Item
|
||||
|
||||
@ -65,8 +65,8 @@ More about pagination, please check [`Pagination`](/components/pagination/).
|
||||
|
||||
### List.Item.Meta
|
||||
|
||||
| Property | Description | Type | Default | Version |
|
||||
| ----------- | ---------------------------- | --------- | ------- | ------- |
|
||||
| avatar | The avatar of list item | ReactNode | - | |
|
||||
| description | The description of list item | ReactNode | - | |
|
||||
| title | The title of list item | ReactNode | - | |
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| avatar | The avatar of list item | ReactNode | - | |
|
||||
| description | The description of list item | ReactNode | - | |
|
||||
| title | The title of list item | ReactNode | - | |
|
||||
|
@ -40,24 +40,24 @@ cover: https://gw.alipayobjects.com/zos/alicdn/5FrZKStG_/List.svg
|
||||
|
||||
分页的配置项。
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| -------- | ------------------ | --------------------------- | -------- |
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| position | 指定分页显示的位置 | `top` \| `bottom` \| `both` | `bottom` |
|
||||
|
||||
更多配置项,请查看 [`Pagination`](/components/pagination/)。
|
||||
|
||||
### List grid props
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| ------ | -------------------- | ------ | ------ | ---- |
|
||||
| column | 列数 | number | - | |
|
||||
| gutter | 栅格间隔 | number | 0 | |
|
||||
| xs | `<576px` 展示的列数 | number | - | |
|
||||
| sm | `≥576px` 展示的列数 | number | - | |
|
||||
| md | `≥768px` 展示的列数 | number | - | |
|
||||
| lg | `≥992px` 展示的列数 | number | - | |
|
||||
| xl | `≥1200px` 展示的列数 | number | - | |
|
||||
| xxl | `≥1600px` 展示的列数 | number | - | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| column | 列数 | number | - | |
|
||||
| gutter | 栅格间隔 | number | 0 | |
|
||||
| xs | `<576px` 展示的列数 | number | - | |
|
||||
| sm | `≥576px` 展示的列数 | number | - | |
|
||||
| md | `≥768px` 展示的列数 | number | - | |
|
||||
| lg | `≥992px` 展示的列数 | number | - | |
|
||||
| xl | `≥1200px` 展示的列数 | number | - | |
|
||||
| xxl | `≥1600px` 展示的列数 | number | - | |
|
||||
|
||||
### List.Item
|
||||
|
||||
@ -68,8 +68,8 @@ cover: https://gw.alipayobjects.com/zos/alicdn/5FrZKStG_/List.svg
|
||||
|
||||
### List.Item.Meta
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| ----------- | ------------------ | --------- | ------ | ---- |
|
||||
| avatar | 列表元素的图标 | ReactNode | - | |
|
||||
| description | 列表元素的描述内容 | ReactNode | - | |
|
||||
| title | 列表元素的标题 | ReactNode | - | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| avatar | 列表元素的图标 | ReactNode | - | |
|
||||
| description | 列表元素的描述内容 | ReactNode | - | |
|
||||
| title | 列表元素的标题 | ReactNode | - | |
|
||||
|
@ -43,10 +43,10 @@ When need to mention someone or something.
|
||||
|
||||
### Mention methods
|
||||
|
||||
| Name | Description |
|
||||
| ------- | ------------ |
|
||||
| blur() | Remove focus |
|
||||
| focus() | Get focus |
|
||||
| Name | Description |
|
||||
| --- | --- |
|
||||
| blur() | Remove focus |
|
||||
| focus() | Get focus |
|
||||
|
||||
### Option
|
||||
|
||||
|
@ -44,14 +44,14 @@ cover: https://gw.alipayobjects.com/zos/alicdn/jPE-itMFM/Mentions.svg
|
||||
|
||||
### Mentions 方法
|
||||
|
||||
| 名称 | 描述 |
|
||||
| ------- | -------- |
|
||||
| blur() | 移除焦点 |
|
||||
| 名称 | 描述 |
|
||||
| --- | --- |
|
||||
| blur() | 移除焦点 |
|
||||
| focus() | 获取焦点 |
|
||||
|
||||
### Option
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| -------- | -------------- | --------- | ------ |
|
||||
| children | 选项内容 | ReactNode | - |
|
||||
| value | 选择时填充的值 | string | - |
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| children | 选项内容 | ReactNode | - |
|
||||
| value | 选择时填充的值 | string | - |
|
||||
|
@ -55,13 +55,13 @@ More layouts with navigation: [Layout](/components/layout).
|
||||
|
||||
### Menu.Item
|
||||
|
||||
| Param | Description | Type | Default value | Version |
|
||||
| -------- | ------------------------------------ | --------- | ------------- | ------- |
|
||||
| danger | Display the danger style | boolean | false | 4.3.0 |
|
||||
| disabled | Whether menu item is disabled | boolean | false | |
|
||||
| icon | The icon of the menu item | ReactNode | - | 4.2.0 |
|
||||
| key | Unique ID of the menu item | string | - | |
|
||||
| title | Set display title for collapsed item | string | - | |
|
||||
| Param | Description | Type | Default value | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| danger | Display the danger style | boolean | false | 4.3.0 |
|
||||
| disabled | Whether menu item is disabled | boolean | false | |
|
||||
| icon | The icon of the menu item | ReactNode | - | 4.2.0 |
|
||||
| key | Unique ID of the menu item | string | - | |
|
||||
| title | Set display title for collapsed item | string | - | |
|
||||
|
||||
> Note: `icon` is a newly added prop in `4.2.0`. For previous versions, please use the following method to define the icon.
|
||||
>
|
||||
@ -97,10 +97,10 @@ More layouts with navigation: [Layout](/components/layout).
|
||||
|
||||
### Menu.ItemGroup
|
||||
|
||||
| Param | Description | Type | Default value | Version |
|
||||
| -------- | ---------------------- | ----------- | ------------- | ------- |
|
||||
| children | Sub-menu items | MenuItem\[] | - | |
|
||||
| title | The title of the group | ReactNode | - | |
|
||||
| Param | Description | Type | Default value | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| children | Sub-menu items | MenuItem\[] | - | |
|
||||
| title | The title of the group | ReactNode | - | |
|
||||
|
||||
### Menu.Divider
|
||||
|
||||
|
@ -56,13 +56,13 @@ cover: https://gw.alipayobjects.com/zos/alicdn/3XZcjGpvK/Menu.svg
|
||||
|
||||
### Menu.Item
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| -------- | ------------------------ | --------- | ------ | ----- |
|
||||
| danger | 展示错误状态样式 | boolean | false | 4.3.0 |
|
||||
| disabled | 是否禁用 | boolean | false | |
|
||||
| icon | 菜单图标 | ReactNode | - | 4.2.0 |
|
||||
| key | item 的唯一标志 | string | - | |
|
||||
| title | 设置收缩时展示的悬浮标题 | string | - | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| danger | 展示错误状态样式 | boolean | false | 4.3.0 |
|
||||
| disabled | 是否禁用 | boolean | false | |
|
||||
| icon | 菜单图标 | ReactNode | - | 4.2.0 |
|
||||
| key | item 的唯一标志 | string | - | |
|
||||
| title | 设置收缩时展示的悬浮标题 | string | - | |
|
||||
|
||||
> 注意:`icon` 是 `4.2.0` 新增的属性,之前的版本请使用下面的方式定义图标。
|
||||
>
|
||||
@ -98,10 +98,10 @@ cover: https://gw.alipayobjects.com/zos/alicdn/3XZcjGpvK/Menu.svg
|
||||
|
||||
### Menu.ItemGroup
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| -------- | ------------ | ----------- | ------ | ---- |
|
||||
| children | 分组的菜单项 | MenuItem\[] | - | |
|
||||
| title | 分组标题 | ReactNode | - | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| children | 分组的菜单项 | MenuItem\[] | - | |
|
||||
| title | 分组标题 | ReactNode | - | |
|
||||
|
||||
### Menu.Divider
|
||||
|
||||
|
@ -57,8 +57,8 @@ The properties of config are as follows:
|
||||
| icon | Customized Icon | ReactNode | - |
|
||||
| key | The unique identifier of the Message | string \| number | - |
|
||||
| style | Customized inline style | [CSSProperties](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/e434515761b36830c3e58a970abf5186f005adac/types/react/index.d.ts#L794) | - |
|
||||
| onClose | Specify a function that will be called when the message is closed | function | - |
|
||||
| onClick | Specify a function that will be called when the message is clicked | function | - |
|
||||
| onClose | Specify a function that will be called when the message is closed | function | - |
|
||||
|
||||
### Global static methods
|
||||
|
||||
@ -120,4 +120,4 @@ return (
|
||||
|
||||
### How to set static methods prefixCls ?
|
||||
|
||||
You can config with [`ConfigProvider.config`](</components/config-provider/#ConfigProvider.config()-4.13.0+>)
|
||||
You can config with [`ConfigProvider.config`](/components/config-provider/#ConfigProvider.config()-4.13.0+)
|
||||
|
@ -25,11 +25,11 @@ cover: https://gw.alipayobjects.com/zos/alicdn/hAkKTIW0K/Message.svg
|
||||
- `message.warn(content, [duration], onClose)` // alias of warning
|
||||
- `message.loading(content, [duration], onClose)`
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| -------- | ------------------------------------------- | ------------------- | ------ |
|
||||
| content | 提示内容 | ReactNode \| config | - |
|
||||
| duration | 自动关闭的延时,单位秒。设为 0 时不自动关闭 | number | 3 |
|
||||
| onClose | 关闭时触发的回调函数 | function | - |
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| content | 提示内容 | ReactNode \| config | - |
|
||||
| duration | 自动关闭的延时,单位秒。设为 0 时不自动关闭 | number | 3 |
|
||||
| onClose | 关闭时触发的回调函数 | function | - |
|
||||
|
||||
组件同时提供 promise 接口。
|
||||
|
||||
@ -58,8 +58,8 @@ cover: https://gw.alipayobjects.com/zos/alicdn/hAkKTIW0K/Message.svg
|
||||
| icon | 自定义图标 | ReactNode | - |
|
||||
| key | 当前提示的唯一标志 | string \| number | - |
|
||||
| style | 自定义内联样式 | [CSSProperties](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/e434515761b36830c3e58a970abf5186f005adac/types/react/index.d.ts#L794) | - |
|
||||
| onClose | 关闭时触发的回调函数 | function | - |
|
||||
| onClick | 点击 message 时触发的回调函数 | function | - |
|
||||
| onClose | 关闭时触发的回调函数 | function | - |
|
||||
|
||||
### 全局方法
|
||||
|
||||
@ -121,4 +121,4 @@ return (
|
||||
|
||||
### 静态方法如何设置 prefixCls ?
|
||||
|
||||
你可以通过 [`ConfigProvider.config`](</components/config-provider/#ConfigProvider.config()-4.13.0+>) 进行设置。
|
||||
你可以通过 [`ConfigProvider.config`](/components/config-provider/#ConfigProvider.config()-4.13.0+) 进行设置。
|
||||
|
@ -171,4 +171,4 @@ You can config `transitionName=""` and `maskTransitionName=""` to remove motion
|
||||
|
||||
### How to set static methods prefixCls ?
|
||||
|
||||
You can config with [`ConfigProvider.config`](</components/config-provider/#ConfigProvider.config()-4.13.0+>)
|
||||
You can config with [`ConfigProvider.config`](/components/config-provider/#ConfigProvider.config()-4.13.0+)
|
||||
|
@ -128,7 +128,7 @@ browserHistory.listen(() => {
|
||||
|
||||
### Modal.useModal()
|
||||
|
||||
当你需要使用 Context 时,可以通过 `Modal.useModal` 创建一个 `contextHolder` 插入子节点中。通过 hooks 创建的临时 Modal 将会得到 `contextHolder` 所在位置的所有上下文。创建的 `modal` 对象拥有与 [`Modal.method`](<#Modal.method()>) 相同的创建通知方法。
|
||||
当你需要使用 Context 时,可以通过 `Modal.useModal` 创建一个 `contextHolder` 插入子节点中。通过 hooks 创建的临时 Modal 将会得到 `contextHolder` 所在位置的所有上下文。创建的 `modal` 对象拥有与 [`Modal.method`](#Modal.method()) 相同的创建通知方法。
|
||||
|
||||
```jsx
|
||||
const [modal, contextHolder] = Modal.useModal();
|
||||
@ -172,4 +172,4 @@ return (
|
||||
|
||||
### 静态方法如何设置 prefixCls ?
|
||||
|
||||
你可以通过 [`ConfigProvider.config`](</components/config-provider/#ConfigProvider.config()-4.13.0+>) 进行设置。
|
||||
你可以通过 [`ConfigProvider.config`](/components/config-provider/#ConfigProvider.config()-4.13.0+) 进行设置。
|
||||
|
@ -100,4 +100,4 @@ return (
|
||||
|
||||
### How to set static methods prefixCls ?
|
||||
|
||||
You can config with [`ConfigProvider.config`](</components/config-provider/#ConfigProvider.config()-4.13.0+>)
|
||||
You can config with [`ConfigProvider.config`](/components/config-provider/#ConfigProvider.config()-4.13.0+)
|
||||
|
@ -101,4 +101,4 @@ return (
|
||||
|
||||
### 静态方法如何设置 prefixCls ?
|
||||
|
||||
你可以通过 [`ConfigProvider.config`](</components/config-provider/#ConfigProvider.config()-4.13.0+>) 进行设置。
|
||||
你可以通过 [`ConfigProvider.config`](/components/config-provider/#ConfigProvider.config()-4.13.0+) 进行设置。
|
||||
|
@ -15,10 +15,10 @@ Comparing with `Tooltip`, besides information `Popover` card can also provide ac
|
||||
|
||||
## API
|
||||
|
||||
| Param | Description | Type | Default value | Version |
|
||||
| ------- | ------------------- | ---------------------------- | ------------- | ------- |
|
||||
| content | Content of the card | ReactNode \| () => ReactNode | - | |
|
||||
| title | Title of the card | ReactNode \| () => ReactNode | - | |
|
||||
| Param | Description | Type | Default value | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| content | Content of the card | ReactNode \| () => ReactNode | - | |
|
||||
| title | Title of the card | ReactNode \| () => ReactNode | - | |
|
||||
|
||||
Consult [Tooltip's documentation](/components/tooltip/#API) to find more APIs.
|
||||
|
||||
|
@ -16,10 +16,10 @@ cover: https://gw.alipayobjects.com/zos/alicdn/1PNL1p_cO/Popover.svg
|
||||
|
||||
## API
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| ------- | -------- | ---------------------------- | ------ | ---- |
|
||||
| content | 卡片内容 | ReactNode \| () => ReactNode | - | |
|
||||
| title | 卡片标题 | ReactNode \| () => ReactNode | - | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| content | 卡片内容 | ReactNode \| () => ReactNode | - | |
|
||||
| title | 卡片标题 | ReactNode \| () => ReactNode | - | |
|
||||
|
||||
更多属性请参考 [Tooltip](/components/tooltip/#API)。
|
||||
|
||||
|
@ -41,11 +41,11 @@ cover: https://gw.alipayobjects.com/zos/alicdn/xqsDu4ZyR/Progress.svg
|
||||
|
||||
### `type="circle"`
|
||||
|
||||
| 属性 | 说明 | 类型 | 默认值 |
|
||||
| ----------- | ------------------------------------------------ | ---------------- | ------ |
|
||||
| strokeColor | 圆形进度条线的色彩,传入 object 时为渐变 | string \| object | - |
|
||||
| strokeWidth | 圆形进度条线的宽度,单位是进度条画布宽度的百分比 | number | 6 |
|
||||
| width | 圆形进度条画布宽度,单位 px | number | 132 |
|
||||
| 属性 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| strokeColor | 圆形进度条线的色彩,传入 object 时为渐变 | string \| object | - |
|
||||
| strokeWidth | 圆形进度条线的宽度,单位是进度条画布宽度的百分比 | number | 6 |
|
||||
| width | 圆形进度条画布宽度,单位 px | number | 132 |
|
||||
|
||||
### `type="dashboard"`
|
||||
|
||||
|
@ -44,7 +44,7 @@ Radio group can wrap a group of `Radio`。
|
||||
|
||||
### Radio
|
||||
|
||||
| Name | Description |
|
||||
| ------- | ------------ |
|
||||
| blur() | Remove focus |
|
||||
| focus() | Get focus |
|
||||
| Name | Description |
|
||||
| --- | --- |
|
||||
| blur() | Remove focus |
|
||||
| focus() | Get focus |
|
||||
|
@ -17,13 +17,13 @@ cover: https://gw.alipayobjects.com/zos/alicdn/8cYb5seNB/Radio.svg
|
||||
|
||||
### Radio/Radio.Button
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| -------------- | --------------------------------- | ------- | ------ |
|
||||
| autoFocus | 自动获取焦点 | boolean | false |
|
||||
| checked | 指定当前是否选中 | boolean | false |
|
||||
| defaultChecked | 初始是否选中 | boolean | false |
|
||||
| disabled | 禁用 Radio | boolean | false |
|
||||
| value | 根据 value 进行比较,判断是否选中 | any | - |
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| autoFocus | 自动获取焦点 | boolean | false |
|
||||
| checked | 指定当前是否选中 | boolean | false |
|
||||
| defaultChecked | 初始是否选中 | boolean | false |
|
||||
| disabled | 禁用 Radio | boolean | false |
|
||||
| value | 根据 value 进行比较,判断是否选中 | any | - |
|
||||
|
||||
### RadioGroup
|
||||
|
||||
@ -45,7 +45,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/8cYb5seNB/Radio.svg
|
||||
|
||||
### Radio
|
||||
|
||||
| 名称 | 描述 |
|
||||
| ------- | -------- |
|
||||
| blur() | 移除焦点 |
|
||||
| 名称 | 描述 |
|
||||
| --- | --- |
|
||||
| blur() | 移除焦点 |
|
||||
| focus() | 获取焦点 |
|
||||
|
@ -35,7 +35,7 @@ Rate component.
|
||||
|
||||
## Methods
|
||||
|
||||
| Name | Description |
|
||||
| ------- | ------------ |
|
||||
| blur() | Remove focus |
|
||||
| focus() | Get focus |
|
||||
| Name | Description |
|
||||
| --- | --- |
|
||||
| blur() | Remove focus |
|
||||
| focus() | Get focus |
|
||||
|
@ -36,7 +36,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/R5uiIWmxe/Rate.svg
|
||||
|
||||
## 方法
|
||||
|
||||
| 名称 | 描述 |
|
||||
| ------- | -------- |
|
||||
| blur() | 移除焦点 |
|
||||
| 名称 | 描述 |
|
||||
| --- | --- |
|
||||
| blur() | 移除焦点 |
|
||||
| focus() | 获取焦点 |
|
||||
|
@ -81,26 +81,26 @@ Select component to select value from options.
|
||||
|
||||
### Select Methods
|
||||
|
||||
| Name | Description | Version |
|
||||
| ------- | ------------ | ------- |
|
||||
| blur() | Remove focus | |
|
||||
| focus() | Get focus | |
|
||||
| Name | Description | Version |
|
||||
| --- | --- | --- |
|
||||
| blur() | Remove focus | |
|
||||
| focus() | Get focus | |
|
||||
|
||||
### Option props
|
||||
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --------- | ------------------------------------------ | ---------------- | ------- | ------- |
|
||||
| className | The additional class to option | string | - | |
|
||||
| disabled | Disable this option | boolean | false | |
|
||||
| title | `title` of Select after select this Option | string | - | |
|
||||
| value | Default to filter with this property | string \| number | - | |
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| className | The additional class to option | string | - | |
|
||||
| disabled | Disable this option | boolean | false | |
|
||||
| title | `title` of Select after select this Option | string | - | |
|
||||
| value | Default to filter with this property | string \| number | - | |
|
||||
|
||||
### OptGroup props
|
||||
|
||||
| Property | Description | Type | Default | Version |
|
||||
| -------- | ----------- | ----------------------- | ------- | ------- |
|
||||
| key | Group key | string | - | |
|
||||
| label | Group label | string \| React.Element | - | |
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| key | Group key | string | - | |
|
||||
| label | Group label | string \| React.Element | - | |
|
||||
|
||||
## FAQ
|
||||
|
||||
|
@ -82,26 +82,26 @@ cover: https://gw.alipayobjects.com/zos/alicdn/_0XzgOis7/Select.svg
|
||||
|
||||
### Select Methods
|
||||
|
||||
| 名称 | 说明 | 版本 |
|
||||
| ------- | -------- | ---- |
|
||||
| blur() | 取消焦点 | |
|
||||
| focus() | 获取焦点 | |
|
||||
| 名称 | 说明 | 版本 |
|
||||
| --- | --- | --- |
|
||||
| blur() | 取消焦点 | |
|
||||
| focus() | 获取焦点 | |
|
||||
|
||||
### Option props
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --------- | --------------------------------- | ---------------- | ------ | ---- |
|
||||
| className | Option 器类名 | string | - | |
|
||||
| disabled | 是否禁用 | boolean | false | |
|
||||
| title | 选中该 Option 后,Select 的 title | string | - | |
|
||||
| value | 默认根据此属性值进行筛选 | string \| number | - | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| className | Option 器类名 | string | - | |
|
||||
| disabled | 是否禁用 | boolean | false | |
|
||||
| title | 选中该 Option 后,Select 的 title | string | - | |
|
||||
| value | 默认根据此属性值进行筛选 | string \| number | - | |
|
||||
|
||||
### OptGroup props
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| ----- | ---- | ----------------------- | ------ | ---- |
|
||||
| key | Key | string | - | |
|
||||
| label | 组名 | string \| React.Element | - | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| key | Key | string | - | |
|
||||
| label | 组名 | string \| React.Element | - | |
|
||||
|
||||
## FAQ
|
||||
|
||||
|
@ -38,9 +38,9 @@ Provide a placeholder while you wait for content to load, or to visualise conten
|
||||
|
||||
### SkeletonTitleProps
|
||||
|
||||
| Property | Description | Type | Default |
|
||||
| -------- | ---------------------- | ---------------- | ------- |
|
||||
| width | Set the width of title | number \| string | - |
|
||||
| Property | Description | Type | Default |
|
||||
| --- | --- | --- | --- |
|
||||
| width | Set the width of title | number \| string | - |
|
||||
|
||||
### SkeletonParagraphProps
|
||||
|
||||
@ -51,15 +51,15 @@ Provide a placeholder while you wait for content to load, or to visualise conten
|
||||
|
||||
### SkeletonButtonProps
|
||||
|
||||
| Property | Description | Type | Default |
|
||||
| -------- | ----------------------- | -------------------------------- | ------- |
|
||||
| active | Show animation effect | boolean | false |
|
||||
| shape | Set the shape of button | `circle` \| `round` \| `default` | - |
|
||||
| size | Set the size of button | `large` \| `small` \| `default` | - |
|
||||
| Property | Description | Type | Default |
|
||||
| --- | --- | --- | --- |
|
||||
| active | Show animation effect | boolean | false |
|
||||
| shape | Set the shape of button | `circle` \| `round` \| `default` | - |
|
||||
| size | Set the size of button | `large` \| `small` \| `default` | - |
|
||||
|
||||
### SkeletonInputProps
|
||||
|
||||
| Property | Description | Type | Default |
|
||||
| -------- | --------------------- | ------------------------------- | ------- |
|
||||
| active | Show animation effect | boolean | false |
|
||||
| size | Set the size of input | `large` \| `small` \| `default` | - |
|
||||
| Property | Description | Type | Default |
|
||||
| --- | --- | --- | --- |
|
||||
| active | Show animation effect | boolean | false |
|
||||
| size | Set the size of input | `large` \| `small` \| `default` | - |
|
||||
|
@ -39,9 +39,9 @@ cover: https://gw.alipayobjects.com/zos/alicdn/KpcciCJgv/Skeleton.svg
|
||||
|
||||
### SkeletonTitleProps
|
||||
|
||||
| 属性 | 说明 | 类型 | 默认值 |
|
||||
| ----- | -------------------- | ---------------- | ------ |
|
||||
| width | 设置标题占位图的宽度 | number \| string | - |
|
||||
| 属性 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| width | 设置标题占位图的宽度 | number \| string | - |
|
||||
|
||||
### SkeletonParagraphProps
|
||||
|
||||
@ -52,15 +52,15 @@ cover: https://gw.alipayobjects.com/zos/alicdn/KpcciCJgv/Skeleton.svg
|
||||
|
||||
### SkeletonButtonProps
|
||||
|
||||
| 属性 | 说明 | 类型 | 默认值 |
|
||||
| ------ | ---------------- | -------------------------------- | ------ |
|
||||
| active | 是否展示动画效果 | boolean | false |
|
||||
| shape | 指定按钮的形状 | `circle` \| `round` \| `default` | - |
|
||||
| size | 设置按钮的大小 | `large` \| `small` \| `default` | - |
|
||||
| 属性 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| active | 是否展示动画效果 | boolean | false |
|
||||
| shape | 指定按钮的形状 | `circle` \| `round` \| `default` | - |
|
||||
| size | 设置按钮的大小 | `large` \| `small` \| `default` | - |
|
||||
|
||||
### SkeletonInputProps
|
||||
|
||||
| 属性 | 说明 | 类型 | 默认值 |
|
||||
| ------ | ---------------- | ------------------------------- | ------ |
|
||||
| active | 是否展示动画效果 | boolean | false |
|
||||
| size | 设置输入框的大小 | `large` \| `small` \| `default` | - |
|
||||
| 属性 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| active | 是否展示动画效果 | boolean | false |
|
||||
| size | 设置输入框的大小 | `large` \| `small` \| `default` | - |
|
||||
|
@ -37,13 +37,13 @@ To input a value in a range.
|
||||
|
||||
### range
|
||||
|
||||
| Property | Description | Type | Default | Version |
|
||||
| -------------- | ------------------------------- | ------- | ------- | ------- |
|
||||
| draggableTrack | Whether range track can be drag | boolean | false | 4.10.0 |
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| draggableTrack | Whether range track can be drag | boolean | false | 4.10.0 |
|
||||
|
||||
## Methods
|
||||
|
||||
| Name | Description | Version |
|
||||
| ------- | ------------ | ------- |
|
||||
| blur() | Remove focus | |
|
||||
| focus() | Get focus | |
|
||||
| Name | Description | Version |
|
||||
| --- | --- | --- |
|
||||
| blur() | Remove focus | |
|
||||
| focus() | Get focus | |
|
||||
|
@ -38,13 +38,13 @@ cover: https://gw.alipayobjects.com/zos/alicdn/HZ3meFc6W/Silder.svg
|
||||
|
||||
### range
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| -------------- | -------------------- | ------- | ------ | ------ |
|
||||
| draggableTrack | 范围刻度是否可被拖拽 | boolean | false | 4.10.0 |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| draggableTrack | 范围刻度是否可被拖拽 | boolean | false | 4.10.0 |
|
||||
|
||||
## 方法
|
||||
|
||||
| 名称 | 描述 | 版本 |
|
||||
| ------- | -------- | ---- |
|
||||
| blur() | 移除焦点 | |
|
||||
| focus() | 获取焦点 | |
|
||||
| 名称 | 描述 | 版本 |
|
||||
| --- | --- | --- |
|
||||
| blur() | 移除焦点 | |
|
||||
| focus() | 获取焦点 | |
|
||||
|
@ -14,14 +14,14 @@ cover: https://gw.alipayobjects.com/zos/alicdn/LBcJqCPRv/Spin.svg
|
||||
|
||||
## API
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| ---------------- | -------------------------------------------- | ------------- | --------- |
|
||||
| delay | 延迟显示加载效果的时间(防止闪烁) | number (毫秒) | - |
|
||||
| indicator | 加载指示符 | ReactNode | - |
|
||||
| size | 组件大小,可选值为 `small` `default` `large` | string | `default` |
|
||||
| spinning | 是否为加载中状态 | boolean | true |
|
||||
| tip | 当作为包裹元素时,可以自定义描述文案 | string | - |
|
||||
| wrapperClassName | 包装器的类属性 | string | - |
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| delay | 延迟显示加载效果的时间(防止闪烁) | number (毫秒) | - |
|
||||
| indicator | 加载指示符 | ReactNode | - |
|
||||
| size | 组件大小,可选值为 `small` `default` `large` | string | `default` |
|
||||
| spinning | 是否为加载中状态 | boolean | true |
|
||||
| tip | 当作为包裹元素时,可以自定义描述文案 | string | - |
|
||||
| wrapperClassName | 包装器的类属性 | string | - |
|
||||
|
||||
### 静态方法
|
||||
|
||||
|
@ -16,27 +16,27 @@ Display statistic number.
|
||||
|
||||
#### Statistic
|
||||
|
||||
| Property | Description | Type | Default | Version |
|
||||
| ---------------- | ----------------------------- | -------------------- | ------- | ------- |
|
||||
| decimalSeparator | The decimal separator | string | `.` | |
|
||||
| formatter | Customize value display logic | (value) => ReactNode | - | |
|
||||
| groupSeparator | Group separator | string | `,` | |
|
||||
| loading | Loading status of Statistic | boolean | false | 4.8.0 |
|
||||
| precision | The precision of input value | number | - | |
|
||||
| prefix | The prefix node of value | ReactNode | - | |
|
||||
| suffix | The suffix node of value | ReactNode | - | |
|
||||
| title | Display title | ReactNode | - | |
|
||||
| value | Display value | string \| number | - | |
|
||||
| valueStyle | Set value css style | CSSProperties | - | |
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| decimalSeparator | The decimal separator | string | `.` | |
|
||||
| formatter | Customize value display logic | (value) => ReactNode | - | |
|
||||
| groupSeparator | Group separator | string | `,` | |
|
||||
| loading | Loading status of Statistic | boolean | false | 4.8.0 |
|
||||
| precision | The precision of input value | number | - | |
|
||||
| prefix | The prefix node of value | ReactNode | - | |
|
||||
| suffix | The suffix node of value | ReactNode | - | |
|
||||
| title | Display title | ReactNode | - | |
|
||||
| value | Display value | string \| number | - | |
|
||||
| valueStyle | Set value css style | CSSProperties | - | |
|
||||
|
||||
#### Statistic.Countdown
|
||||
|
||||
| Property | Description | Type | Default | Version |
|
||||
| ---------- | ---------------------------------------- | ---------------- | ---------- | ------- |
|
||||
| format | Format as [moment](http://momentjs.com/) | string | `HH:mm:ss` | |
|
||||
| prefix | The prefix node of value | ReactNode | - | |
|
||||
| suffix | The suffix node of value | ReactNode | - | |
|
||||
| title | Display title | ReactNode | - | |
|
||||
| value | Set target countdown time | number \| moment | - | |
|
||||
| valueStyle | Set value css style | CSSProperties | - | |
|
||||
| onFinish | Trigger when time's up | () => void | - | |
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| format | Format as [moment](http://momentjs.com/) | string | `HH:mm:ss` | |
|
||||
| prefix | The prefix node of value | ReactNode | - | |
|
||||
| suffix | The suffix node of value | ReactNode | - | |
|
||||
| title | Display title | ReactNode | - | |
|
||||
| value | Set target countdown time | number \| moment | - | |
|
||||
| valueStyle | Set value css style | CSSProperties | - | |
|
||||
| onFinish | Trigger when time's up | () => void | - | |
|
||||
|
@ -17,18 +17,18 @@ cover: https://gw.alipayobjects.com/zos/antfincdn/rcBNhLBrKbE/Statistic.svg
|
||||
|
||||
#### Statistic
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| ---------------- | ---------------- | -------------------- | ------ | ----- |
|
||||
| decimalSeparator | 设置小数点 | string | `.` | |
|
||||
| formatter | 自定义数值展示 | (value) => ReactNode | - | |
|
||||
| groupSeparator | 设置千分位标识符 | string | `,` | |
|
||||
| loading | 数值是否加载中 | boolean | false | 4.8.0 |
|
||||
| precision | 数值精度 | number | - | |
|
||||
| prefix | 设置数值的前缀 | ReactNode | - | |
|
||||
| suffix | 设置数值的后缀 | ReactNode | - | |
|
||||
| title | 数值的标题 | ReactNode | - | |
|
||||
| value | 数值内容 | string \| number | - | |
|
||||
| valueStyle | 设置数值的样式 | CSSProperties | - | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| decimalSeparator | 设置小数点 | string | `.` | |
|
||||
| formatter | 自定义数值展示 | (value) => ReactNode | - | |
|
||||
| groupSeparator | 设置千分位标识符 | string | `,` | |
|
||||
| loading | 数值是否加载中 | boolean | false | 4.8.0 |
|
||||
| precision | 数值精度 | number | - | |
|
||||
| prefix | 设置数值的前缀 | ReactNode | - | |
|
||||
| suffix | 设置数值的后缀 | ReactNode | - | |
|
||||
| title | 数值的标题 | ReactNode | - | |
|
||||
| value | 数值内容 | string \| number | - | |
|
||||
| valueStyle | 设置数值的样式 | CSSProperties | - | |
|
||||
|
||||
#### Statistic.Countdown
|
||||
|
||||
|
@ -30,7 +30,7 @@ Switching Selector.
|
||||
|
||||
## Methods
|
||||
|
||||
| Name | Description |
|
||||
| ------- | ------------ |
|
||||
| blur() | Remove focus |
|
||||
| focus() | Get focus |
|
||||
| Name | Description |
|
||||
| --- | --- |
|
||||
| blur() | Remove focus |
|
||||
| focus() | Get focus |
|
||||
|
@ -31,7 +31,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/zNdJQMhfm/Switch.svg
|
||||
|
||||
## 方法
|
||||
|
||||
| 名称 | 描述 |
|
||||
| ------- | -------- |
|
||||
| blur() | 移除焦点 |
|
||||
| 名称 | 描述 |
|
||||
| --- | --- |
|
||||
| blur() | 移除焦点 |
|
||||
| focus() | 获取焦点 |
|
||||
|
@ -147,9 +147,9 @@ One of the Table `columns` prop for describing the table's columns, Column has t
|
||||
|
||||
### ColumnGroup
|
||||
|
||||
| Property | Description | Type | Default |
|
||||
| -------- | ------------------------- | --------- | ------- |
|
||||
| title | Title of the column group | ReactNode | - |
|
||||
| Property | Description | Type | Default |
|
||||
| --- | --- | --- | --- |
|
||||
| title | Title of the column group | ReactNode | - |
|
||||
|
||||
### pagination
|
||||
|
||||
@ -167,8 +167,8 @@ Properties for expandable.
|
||||
|
||||
| Property | Description | Type | Default |
|
||||
| --- | --- | --- | --- |
|
||||
| columnWidth | Set the width of the expand column | string \| number | - |
|
||||
| childrenColumnName | The column contains children to display | string | children |
|
||||
| columnWidth | Set the width of the expand column | string \| number | - |
|
||||
| defaultExpandAllRows | Expand all rows initially | boolean | false |
|
||||
| defaultExpandedRowKeys | Initial expanded row keys | string\[] | - |
|
||||
| expandedRowClassName | Expanded row's className | function(record, index, indent): string | - |
|
||||
|
@ -154,9 +154,9 @@ const columns = [
|
||||
|
||||
### ColumnGroup
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| ----- | ------------ | --------- | ------ |
|
||||
| title | 列头显示文字 | ReactNode | - |
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| title | 列头显示文字 | ReactNode | - |
|
||||
|
||||
### pagination
|
||||
|
||||
@ -174,8 +174,8 @@ const columns = [
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| columnWidth | 自定义展开列宽度 | string \| number | - |
|
||||
| childrenColumnName | 指定树形结构的列名 | string | children |
|
||||
| columnWidth | 自定义展开列宽度 | string \| number | - |
|
||||
| defaultExpandAllRows | 初始时,是否展开所有行 | boolean | false |
|
||||
| defaultExpandedRowKeys | 默认展开的行 | string\[] | - |
|
||||
| expandedRowClassName | 展开行的 className | function(record, index, indent): string | - |
|
||||
@ -222,11 +222,11 @@ const columns = [
|
||||
|
||||
### selection
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| -------- | -------------------------- | --------------------------- | ------ |
|
||||
| key | React 需要的 key,建议设置 | string | - |
|
||||
| text | 选择项显示的文字 | ReactNode | - |
|
||||
| onSelect | 选择项点击回调 | function(changeableRowKeys) | - |
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| key | React 需要的 key,建议设置 | string | - |
|
||||
| text | 选择项显示的文字 | ReactNode | - |
|
||||
| onSelect | 选择项点击回调 | function(changeableRowKeys) | - |
|
||||
|
||||
## 在 TypeScript 中使用
|
||||
|
||||
|
@ -46,9 +46,9 @@ Ant Design 依次提供了三级选项卡,分别用于不同的场景。
|
||||
|
||||
### Tabs.TabPane
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| ----------- | ----------------------------------------------- | --------- | ------ |
|
||||
| closeIcon | 自定义关闭图标,`在 type="editable-card"`时有效 | ReactNode | - |
|
||||
| forceRender | 被隐藏时是否渲染 DOM 结构 | boolean | false |
|
||||
| key | 对应 activeKey | string | - |
|
||||
| tab | 选项卡头显示文字 | ReactNode | - |
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| closeIcon | 自定义关闭图标,`在 type="editable-card"`时有效 | ReactNode | - |
|
||||
| forceRender | 被隐藏时是否渲染 DOM 结构 | boolean | false |
|
||||
| key | 对应 activeKey | string | - |
|
||||
| tab | 选项卡头显示文字 | ReactNode | - |
|
||||
|
@ -17,18 +17,18 @@ Tag for categorizing or markup.
|
||||
|
||||
### Tag
|
||||
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --------- | ------------------------------------ | ----------- | ------- | ------- |
|
||||
| closable | Whether the Tag can be closed | boolean | false | |
|
||||
| closeIcon | Custom close icon | ReactNode | - | 4.4.0 |
|
||||
| color | Color of the Tag | string | - | |
|
||||
| icon | Set the icon of tag | ReactNode | - | |
|
||||
| visible | Whether the Tag is closed or not | boolean | true | |
|
||||
| onClose | Callback executed when tag is closed | (e) => void | - | |
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| closable | Whether the Tag can be closed | boolean | false | |
|
||||
| closeIcon | Custom close icon | ReactNode | - | 4.4.0 |
|
||||
| color | Color of the Tag | string | - | |
|
||||
| icon | Set the icon of tag | ReactNode | - | |
|
||||
| visible | Whether the Tag is closed or not | boolean | true | |
|
||||
| onClose | Callback executed when tag is closed | (e) => void | - | |
|
||||
|
||||
### Tag.CheckableTag
|
||||
|
||||
| Property | Description | Type | Default |
|
||||
| -------- | ----------------------------------------------- | ----------------- | ------- |
|
||||
| checked | Checked status of Tag | boolean | false |
|
||||
| onChange | Callback executed when Tag is checked/unchecked | (checked) => void | - |
|
||||
| Property | Description | Type | Default |
|
||||
| --- | --- | --- | --- |
|
||||
| checked | Checked status of Tag | boolean | false |
|
||||
| onChange | Callback executed when Tag is checked/unchecked | (checked) => void | - |
|
||||
|
@ -17,18 +17,18 @@ cover: https://gw.alipayobjects.com/zos/alicdn/cH1BOLfxC/Tag.svg
|
||||
|
||||
### Tag
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --------- | ---------------- | ----------- | ------ | ----- |
|
||||
| closable | 标签是否可以关闭 | boolean | false | |
|
||||
| closeIcon | 自定义关闭按钮 | ReactNode | - | 4.4.0 |
|
||||
| color | 标签色 | string | - | |
|
||||
| icon | 设置图标 | ReactNode | - | |
|
||||
| visible | 是否显示标签 | boolean | true | |
|
||||
| onClose | 关闭时的回调 | (e) => void | - | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| closable | 标签是否可以关闭 | boolean | false | |
|
||||
| closeIcon | 自定义关闭按钮 | ReactNode | - | 4.4.0 |
|
||||
| color | 标签色 | string | - | |
|
||||
| icon | 设置图标 | ReactNode | - | |
|
||||
| visible | 是否显示标签 | boolean | true | |
|
||||
| onClose | 关闭时的回调 | (e) => void | - | |
|
||||
|
||||
### Tag.CheckableTag
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| -------- | -------------------- | ----------------- | ------ |
|
||||
| checked | 设置标签的选中状态 | boolean | false |
|
||||
| onChange | 点击标签时触发的回调 | (checked) => void | - |
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| checked | 设置标签的选中状态 | boolean | false |
|
||||
| onChange | 点击标签时触发的回调 | (checked) => void | - |
|
||||
|
@ -58,18 +58,18 @@ import moment from 'moment';
|
||||
|
||||
## Methods
|
||||
|
||||
| Name | Description | Version |
|
||||
| ------- | ------------ | ------- |
|
||||
| blur() | Remove focus | |
|
||||
| focus() | Get focus | |
|
||||
| Name | Description | Version |
|
||||
| --- | --- | --- |
|
||||
| blur() | Remove focus | |
|
||||
| focus() | Get focus | |
|
||||
|
||||
### RangePicker
|
||||
|
||||
Same props from [RangePicker](/components/date-picker/#RangePicker) of DatePicker. And includes additional props:
|
||||
|
||||
| Property | Description | Type | Default | Version |
|
||||
| -------- | ------------------------ | ------- | ------- | ------- |
|
||||
| order | Order start and end time | boolean | true | 4.1.0 |
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| order | Order start and end time | boolean | true | 4.1.0 |
|
||||
|
||||
<style>
|
||||
.code-box-demo .ant-picker { margin: 0 8px 12px 0; }
|
||||
|
@ -57,18 +57,18 @@ import moment from 'moment';
|
||||
|
||||
## 方法
|
||||
|
||||
| 名称 | 描述 | 版本 |
|
||||
| ------- | -------- | ---- |
|
||||
| blur() | 移除焦点 | |
|
||||
| focus() | 获取焦点 | |
|
||||
| 名称 | 描述 | 版本 |
|
||||
| --- | --- | --- |
|
||||
| blur() | 移除焦点 | |
|
||||
| focus() | 获取焦点 | |
|
||||
|
||||
### RangePicker
|
||||
|
||||
属性与 DatePicker 的 [RangePicker](/components/date-picker/#RangePicker) 相同。还包含以下属性:
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| ----- | -------------------- | ------- | ------ | ----- |
|
||||
| order | 始末时间是否自动排序 | boolean | true | 4.1.0 |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| order | 始末时间是否自动排序 | boolean | true | 4.1.0 |
|
||||
|
||||
<style>
|
||||
.code-box-demo .ant-picker { margin: 0 8px 12px 0; }
|
||||
|
@ -14,9 +14,9 @@ A simple text popup tip.
|
||||
|
||||
## API
|
||||
|
||||
| Property | Description | Type | Default |
|
||||
| -------- | ----------------------------- | ---------------------------- | ------- |
|
||||
| title | The text shown in the tooltip | ReactNode \| () => ReactNode | - |
|
||||
| Property | Description | Type | Default |
|
||||
| --- | --- | --- | --- |
|
||||
| title | The text shown in the tooltip | ReactNode \| () => ReactNode | - |
|
||||
|
||||
### Common API
|
||||
|
||||
|
@ -16,9 +16,9 @@ cover: https://gw.alipayobjects.com/zos/alicdn/Vyyeu8jq2/Tooltp.svg
|
||||
|
||||
## API
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| ----- | -------- | ---------------------------- | ------ |
|
||||
| title | 提示文字 | ReactNode \| () => ReactNode | - |
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| title | 提示文字 | ReactNode \| () => ReactNode | - |
|
||||
|
||||
### 共同的 API
|
||||
|
||||
|
@ -47,14 +47,14 @@ One or more elements can be selected from either column, one click on the proper
|
||||
|
||||
Transfer accept `children` to customize render list, using follow props:
|
||||
|
||||
| Property | Description | Type | Version |
|
||||
| --------------- | ----------------------- | ------------------------------------ | ------- |
|
||||
| direction | List render direction | `left` \| `right` | |
|
||||
| disabled | Disable list or not | boolean | |
|
||||
| filteredItems | Filtered items | RecordType\[] | |
|
||||
| selectedKeys | Selected items | string\[] | |
|
||||
| onItemSelect | Select item | (key: string, selected: boolean) | |
|
||||
| onItemSelectAll | Select a group of items | (keys: string\[], selected: boolean) | |
|
||||
| Property | Description | Type | Version |
|
||||
| --- | --- | --- | --- |
|
||||
| direction | List render direction | `left` \| `right` | |
|
||||
| disabled | Disable list or not | boolean | |
|
||||
| filteredItems | Filtered items | RecordType\[] | |
|
||||
| selectedKeys | Selected items | string\[] | |
|
||||
| onItemSelect | Select item | (key: string, selected: boolean) | |
|
||||
| onItemSelectAll | Select a group of items | (keys: string\[], selected: boolean) | |
|
||||
|
||||
#### example
|
||||
|
||||
|
@ -49,14 +49,14 @@ cover: https://gw.alipayobjects.com/zos/alicdn/QAXskNI4G/Transfer.svg
|
||||
|
||||
Transfer 支持接收 `children` 自定义渲染列表,并返回以下参数:
|
||||
|
||||
| 参数 | 说明 | 类型 | 版本 |
|
||||
| --------------- | -------------- | ------------------------------------ | ---- |
|
||||
| direction | 渲染列表的方向 | `left` \| `right` | |
|
||||
| disabled | 是否禁用列表 | boolean | |
|
||||
| filteredItems | 过滤后的数据 | RecordType\[] | |
|
||||
| selectedKeys | 选中的条目 | string\[] | |
|
||||
| onItemSelect | 勾选条目 | (key: string, selected: boolean) | |
|
||||
| onItemSelectAll | 勾选一组条目 | (keys: string\[], selected: boolean) | |
|
||||
| 参数 | 说明 | 类型 | 版本 |
|
||||
| --- | --- | --- | --- |
|
||||
| direction | 渲染列表的方向 | `left` \| `right` | |
|
||||
| disabled | 是否禁用列表 | boolean | |
|
||||
| filteredItems | 过滤后的数据 | RecordType\[] | |
|
||||
| selectedKeys | 选中的条目 | string\[] | |
|
||||
| onItemSelect | 勾选条目 | (key: string, selected: boolean) | |
|
||||
| onItemSelectAll | 勾选一组条目 | (keys: string\[], selected: boolean) | |
|
||||
|
||||
#### 参考示例
|
||||
|
||||
|
@ -62,10 +62,10 @@ Tree selection control.
|
||||
|
||||
### Tree Methods
|
||||
|
||||
| Name | Description | Version |
|
||||
| ------- | ------------ | ------- |
|
||||
| blur() | Remove focus | |
|
||||
| focus() | Get focus | |
|
||||
| Name | Description | Version |
|
||||
| --- | --- | --- |
|
||||
| blur() | Remove focus | |
|
||||
| focus() | Get focus | |
|
||||
|
||||
### TreeNode props
|
||||
|
||||
|
@ -63,25 +63,25 @@ cover: https://gw.alipayobjects.com/zos/alicdn/Ax4DA0njr/TreeSelect.svg
|
||||
|
||||
### Tree 方法
|
||||
|
||||
| 名称 | 描述 | 版本 |
|
||||
| ------- | -------- | ---- |
|
||||
| blur() | 移除焦点 | |
|
||||
| focus() | 获取焦点 | |
|
||||
| 名称 | 描述 | 版本 |
|
||||
| --- | --- | --- |
|
||||
| blur() | 移除焦点 | |
|
||||
| focus() | 获取焦点 | |
|
||||
|
||||
### TreeNode props
|
||||
|
||||
> 建议使用 treeData 来代替 TreeNode,免去手工构造麻烦
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --------------- | -------------------------------------------------- | --------- | ------ | ---- |
|
||||
| checkable | 当树为 Checkbox 时,设置独立节点是否展示 Checkbox | boolean | - | |
|
||||
| disableCheckbox | 禁掉 Checkbox | boolean | false | |
|
||||
| disabled | 是否禁用 | boolean | false | |
|
||||
| isLeaf | 是否是叶子节点 | boolean | false | |
|
||||
| key | 此项必须设置(其值在整个树范围内唯一) | string | - | |
|
||||
| selectable | 是否可选 | boolean | true | |
|
||||
| title | 树节点显示的内容 | ReactNode | `---` | |
|
||||
| value | 默认根据此属性值进行筛选(其值在整个树范围内唯一) | string | - | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| checkable | 当树为 Checkbox 时,设置独立节点是否展示 Checkbox | boolean | - | |
|
||||
| disableCheckbox | 禁掉 Checkbox | boolean | false | |
|
||||
| disabled | 是否禁用 | boolean | false | |
|
||||
| isLeaf | 是否是叶子节点 | boolean | false | |
|
||||
| key | 此项必须设置(其值在整个树范围内唯一) | string | - | |
|
||||
| selectable | 是否可选 | boolean | true | |
|
||||
| title | 树节点显示的内容 | ReactNode | `---` | |
|
||||
| value | 默认根据此属性值进行筛选(其值在整个树范围内唯一) | string | - | |
|
||||
|
||||
## FAQ
|
||||
|
||||
|
@ -114,15 +114,15 @@ cover: https://gw.alipayobjects.com/zos/alicdn/GOM1KQ24O/Typography.svg
|
||||
onEllipsis: function(ellipsis),
|
||||
}
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| ---------- | -------------------- | -------------------- | ------ | ------ |
|
||||
| expandable | 是否可展开 | boolean | - | |
|
||||
| rows | 最多显示的行数 | number | - | |
|
||||
| suffix | 自定义省略内容后缀 | string | - | |
|
||||
| symbol | 自定义展开描述文案 | ReactNode | `展开` | |
|
||||
| tooltip | 省略时,展示提示信息 | boolean \| ReactNode | - | 4.11.0 |
|
||||
| onEllipsis | 触发省略时的回调 | function(ellipsis) | - | 4.2.0 |
|
||||
| onExpand | 点击展开时的回调 | function(event) | - | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| expandable | 是否可展开 | boolean | - | |
|
||||
| rows | 最多显示的行数 | number | - | |
|
||||
| suffix | 自定义省略内容后缀 | string | - | |
|
||||
| symbol | 自定义展开描述文案 | ReactNode | `展开` | |
|
||||
| tooltip | 省略时,展示提示信息 | boolean \| ReactNode | - | 4.11.0 |
|
||||
| onEllipsis | 触发省略时的回调 | function(ellipsis) | - | 4.2.0 |
|
||||
| onExpand | 点击展开时的回调 | function(event) | - | |
|
||||
|
||||
## FAQ
|
||||
|
||||
|
@ -52,12 +52,12 @@ Extends File with additional props.
|
||||
|
||||
| Property | Description | Type | Default |
|
||||
| --- | --- | --- | --- |
|
||||
| uid | unique id. Will auto generate when not provided | string | - |
|
||||
| name | File name | string | - |
|
||||
| url | Download url | string | - |
|
||||
| status | Upload status. Show different style when configured | `error` \| `success` \| `done` \| `uploading` \| `removed` | - |
|
||||
| percent | Upload progress percent | number | - |
|
||||
| status | Upload status. Show different style when configured | `error` \| `success` \| `done` \| `uploading` \| `removed` | - |
|
||||
| thumbUrl | Thumb image url | string | - |
|
||||
| uid | unique id. Will auto generate when not provided | string | - |
|
||||
| url | Download url | string | - |
|
||||
|
||||
### onChange
|
||||
|
||||
|
@ -53,12 +53,12 @@ cover: https://gw.alipayobjects.com/zos/alicdn/QaeBt_ZMg/Upload.svg
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| uid | 唯一标识符,不设置时会自动生成 | string | - |
|
||||
| name | 文件名 | string | - |
|
||||
| url | 下载地址 | string | - |
|
||||
| status | 上传状态,不同状态展示颜色也会有所不同 | `error` \| `success` \| `done` \| `uploading` \| `removed` | - |
|
||||
| percent | 上传进度 | number | - |
|
||||
| status | 上传状态,不同状态展示颜色也会有所不同 | `error` \| `success` \| `done` \| `uploading` \| `removed` | - |
|
||||
| thumbUrl | 缩略图地址 | string | - |
|
||||
| uid | 唯一标识符,不设置时会自动生成 | string | - |
|
||||
| url | 下载地址 | string | - |
|
||||
|
||||
### onChange
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user