Skip to content

Commit 5ed9665

Browse files
uyarnuyarn
authored
feat: add force render for portal components (#251)
1 parent b63f594 commit 5ed9665

File tree

6 files changed

+94
-10
lines changed

6 files changed

+94
-10
lines changed

‎db/TDesign.db

0 Bytes
Binary file not shown.

‎packages/products/tdesign-react/src/dialog/dialog.en-US.md

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,22 @@
11
:: BASE_DOC ::
22

33
## API
4+
45
### DialogCard Props
56

67
name | type | default | description | required
78
-- | -- | -- | -- | --
8-
className | String | - | 类名 | N
9-
style | Object | - | 样式，Typescript：`React.CSSProperties` | N
9+
className | String | - | className of component | N
10+
style | Object | - | CSS(Cascading Style Sheets)，Typescript：`React.CSSProperties` | N
1011
`Pick<DialogProps, 'body' \| 'cancelBtn' \| 'closeBtn' \| 'confirmBtn' \| 'footer' \| 'header' \| 'theme' \| 'onCancel' \| 'onCloseBtnClick' \| 'onConfirm'>` | TNode | - | extends `Pick<DialogProps, 'body' \| 'cancelBtn' \| 'closeBtn' \| 'confirmBtn' \| 'footer' \| 'header' \| 'theme' \| 'onCancel' \| 'onCloseBtnClick' \| 'onConfirm'>`。Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
1112

13+
1214
### Dialog Props
1315

1416
name | type | default | description | required
1517
-- | -- | -- | -- | --
16-
className | String | - | 类名 | N
17-
style | Object | - | 样式，Typescript：`React.CSSProperties` | N
18+
className | String | - | className of component | N
19+
style | Object | - | CSS(Cascading Style Sheets)，Typescript：`React.CSSProperties` | N
1820
attach | String / Function | - | Typescript：`AttachNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
1921
body | TNode | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
2022
cancelBtn | TNode | - | Typescript：`string \| ButtonProps \| TNode \| null`，[Button API Documents](./button?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts)。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/dialog/type.ts) | N
@@ -29,6 +31,7 @@ destroyOnClose | Boolean | false | \- | N
2931
dialogClassName | String | - | \- | N
3032
draggable | Boolean | false | \- | N
3133
footer | TNode | true | Typescript：`boolean \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
34+
forceRender | Boolean | false | to force render Dialog | N
3235
header | TNode | true | Typescript：`string \| boolean \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
3336
mode | String | modal | options: modal/modeless/full-screen | N
3437
placement | String | top | options: top/center | N

‎packages/products/tdesign-react/src/dialog/dialog.md

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,19 @@
11
:: BASE_DOC ::
22

33
## API
4+
45
### DialogCard Props
56

6-
名称 | 类型 | 默认值 | 说明 | 必传
7+
名称 | 类型 | 默认值 | 描述 | 必传
78
-- | -- | -- | -- | --
89
className | String | - | 类名 | N
910
style | Object | - | 样式，TS 类型：`React.CSSProperties` | N
1011
`Pick<DialogProps, 'body' \| 'cancelBtn' \| 'closeBtn' \| 'confirmBtn' \| 'footer' \| 'header' \| 'theme' \| 'onCancel' \| 'onCloseBtnClick' \| 'onConfirm'>` | TNode | - | 继承 `Pick<DialogProps, 'body' \| 'cancelBtn' \| 'closeBtn' \| 'confirmBtn' \| 'footer' \| 'header' \| 'theme' \| 'onCancel' \| 'onCloseBtnClick' \| 'onConfirm'>` 中的全部属性。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
1112

13+
1214
### Dialog Props
1315

14-
名称 | 类型 | 默认值 | 说明 | 必传
16+
名称 | 类型 | 默认值 | 描述 | 必传
1517
-- | -- | -- | -- | --
1618
className | String | - | 类名 | N
1719
style | Object | - | 样式，TS 类型：`React.CSSProperties` | N
@@ -29,6 +31,7 @@ destroyOnClose | Boolean | false | 是否在关闭弹框的时候销毁子元素
2931
dialogClassName | String | - | 弹框元素类名，示例：'t-class-dialog-first t-class-dialog-second' | N
3032
draggable | Boolean | false | 对话框是否可以拖拽（仅在非模态对话框时有效） | N
3133
footer | TNode | true | 底部操作栏，默认会有“确认”和“取消”两个按钮。值为 true 显示默认操作按钮，值为 false 不显示任何内容，值类型为 Function 表示自定义底部内容。TS 类型：`boolean \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
34+
forceRender | Boolean | false | 是否强制渲染Dialog | N
3235
header | TNode | true | 头部内容。值为 true 显示空白头部，值为 false 不显示任何内容，值类型为 string 则直接显示值，值类型为 Function 表示自定义头部内容。TS 类型：`string \| boolean \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
3336
mode | String | modal | 对话框类型，有 3 种：模态对话框、非模态对话框、全屏对话框。弹出「模态对话框」时，只能操作对话框里面的内容，不能操作其他内容。弹出「非模态对话框」时，则可以操作页面内所有内容。「普通对话框」是指没有脱离文档流的对话框，可以在这个基础上开发更多的插件。可选项：modal/modeless/full-screen | N
3437
placement | String | top | 对话框位置，内置两种：垂直水平居中显示 和 靠近顶部（top:20%）显示。默认情况，为避免贴顶或贴底，顶部和底部距离最小为 `48px`，可通过调整 `top` 覆盖默认大小。可选项：top/center | N
@@ -51,7 +54,7 @@ onOverlayClick | Function | | TS 类型：`(context: { e: MouseEvent }) => void
5154

5255
### DialogOptions
5356

54-
名称 | 类型 | 默认值 | 说明 | 必传
57+
名称 | 类型 | 默认值 | 描述 | 必传
5558
-- | -- | -- | -- | --
5659
attach | String / Function | 'body' | 对话框挂载的节点。数据类型为 String 时，会被当作选择器处理，进行节点查询。示例：'body' 或 () => document.body。TS 类型：`AttachNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
5760
className | String | - | 弹框类名，示例：'t-class-dialog-first t-class-dialog-second' | N
@@ -70,20 +73,20 @@ update | `(props: DialogOptions)` | \- | 必需。更新弹框内容
7073

7174
### dialog 或 DialogPlugin
7275

73-
参数名称 | 参数类型 | 参数默认值 | 参数说明
76+
参数名称 | 参数类型 | 参数默认值 | 参数描述
7477
-- | -- | -- | --
7578
options | \- | - | TS 类型：`DialogOptions`
7679

7780
插件返回值：`DialogInstance`
7881

7982
### dialog.confirm 或 DialogPlugin.confirm
8083

81-
参数名称 | 参数类型 | 参数默认值 | 参数说明
84+
参数名称 | 参数类型 | 参数默认值 | 参数描述
8285
-- | -- | -- | --
8386
options | \- | - | TS 类型：`DialogOptions`
8487

8588
### dialog.alert 或 DialogPlugin.alert
8689

87-
参数名称 | 参数类型 | 参数默认值 | 参数说明
90+
参数名称 | 参数类型 | 参数默认值 | 参数描述
8891
-- | -- | -- | --
8992
options | Object | - | TS 类型：`Omit<DialogOptions, 'cancelBtn'>`

‎packages/products/tdesign-react/src/drawer/drawer.en-US.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ closeOnOverlayClick | Boolean | true | \- | N
1818
confirmBtn | TNode | - | Typescript：`FooterButton` `type FooterButton = string \| ButtonProps \| TNode`，[Button API Documents](./button?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts)。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/drawer/type.ts) | N
1919
destroyOnClose | Boolean | false | \- | N
2020
footer | TNode | true | Typescript：`boolean \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
21+
forceRender | Boolean | false | to force render Drawer | N
2122
header | TNode | true | Typescript：`string \| boolean \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
2223
mode | String | overlay | options: overlay/push | N
2324
placement | String | right | options: left/right/top/bottom | N
@@ -42,6 +43,7 @@ name | type | default | description | required
4243
-- | -- | -- | -- | --
4344
attach | String / Function | 'body' | Typescript：`AttachNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
4445
className | String | - | \- | N
46+
style | Object | - | Typescript：`Styles`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
4547
`Omit<DrawerProps, 'attach'>` | \- | - | extends `Omit<DrawerProps, 'attach'>` | N
4648

4749
### DrawerInstance

‎packages/products/tdesign-react/src/drawer/drawer.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ closeOnOverlayClick | Boolean | true | 点击蒙层时是否触发抽屉关闭
1818
confirmBtn | TNode | - | 确认按钮。值类型为字符串，则表示自定义按钮文本，值类型为 Object 则表示透传 Button 组件属性。使用 TNode 自定义按钮时，需自行控制确认事件。TS 类型：`FooterButton` `type FooterButton = string \| ButtonProps \| TNode`，[Button API Documents](./button?tab=api)。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts)。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/drawer/type.ts) | N
1919
destroyOnClose | Boolean | false | 抽屉关闭时是否销毁节点 | N
2020
footer | TNode | true | 底部操作栏，默认会有“确认”和“取消”两个按钮。值为 true 显示默认操作按钮，值为 false 或 null 不显示任何内容，值类型为 TNode 表示自定义底部内容。TS 类型：`boolean \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
21+
forceRender | Boolean | false | 是否强制渲染Drawer | N
2122
header | TNode | true | 头部内容。值为 true 显示空白头部，值为 false 不显示头部，值类型为 string 则直接显示值，值类型为 TNode 表示自定义头部内容。TS 类型：`string \| boolean \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
2223
mode | String | overlay | 展开方式，有两种：直接展示在内容上方 和 推开内容区域。可选项：overlay/push | N
2324
placement | String | right | 抽屉方向。可选项：left/right/top/bottom | N
@@ -42,6 +43,7 @@ onSizeDragEnd | Function | | TS 类型：`(context: { e: MouseEvent; size: numb
4243
-- | -- | -- | -- | --
4344
attach | String / Function | 'body' | 抽屉挂载的节点。数据类型为 String 时，会被当作选择器处理，进行节点查询。示例：'body' 或 () => document.body。TS 类型：`AttachNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
4445
className | String | - | 抽屉类名，示例：'t-class-drawer-first t-class-drawer-second' | N
46+
style | Object | - | 弹框 style 属性，输入 [CSSStyleDeclaration.cssText](https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleDeclaration/cssText)。TS 类型：`Styles`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
4547
`Omit<DrawerProps, 'attach'>` | \- | - | 继承 `Omit<DrawerProps, 'attach'>` 中的全部属性 | N
4648

4749
### DrawerInstance

‎packages/scripts/api.json

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35514,6 +35514,43 @@
3551435514
"TNode"
3551535515
]
3551635516
},
35517+
{
35518+
"id": 1711943474,
35519+
"platform_framework": [
35520+
"2"
35521+
],
35522+
"component": "Dialog",
35523+
"field_category": 1,
35524+
"field_name": "forceRender",
35525+
"field_type": [
35526+
"4"
35527+
],
35528+
"field_default_value": "false",
35529+
"field_enum": "",
35530+
"field_desc_zh": "是否强制渲染Dialog",
35531+
"field_desc_en": "to force render Dialog",
35532+
"field_required": 0,
35533+
"event_input": "",
35534+
"create_time": "2024-04-01 03:51:14",
35535+
"update_time": "2024-04-01 03:51:14",
35536+
"event_output": null,
35537+
"custom_field_type": null,
35538+
"syntactic_sugar": null,
35539+
"readonly": 1,
35540+
"html_attribute": 0,
35541+
"trigger_elements": "",
35542+
"deprecated": 0,
35543+
"version": "",
35544+
"test_description": null,
35545+
"support_default_value": 0,
35546+
"field_category_text": "Props",
35547+
"platform_framework_text": [
35548+
"React(PC)"
35549+
],
35550+
"field_type_text": [
35551+
"Boolean"
35552+
]
35553+
},
3551735554
{
3551835555
"id": 52,
3551935556
"platform_framework": [
@@ -38187,6 +38224,43 @@
3818738224
"TNode"
3818838225
]
3818938226
},
38227+
{
38228+
"id": 1711943489,
38229+
"platform_framework": [
38230+
"2"
38231+
],
38232+
"component": "Drawer",
38233+
"field_category": 1,
38234+
"field_name": "forceRender",
38235+
"field_type": [
38236+
"4"
38237+
],
38238+
"field_default_value": "false",
38239+
"field_enum": "",
38240+
"field_desc_zh": "是否强制渲染Drawer",
38241+
"field_desc_en": "to force render Drawer",
38242+
"field_required": 0,
38243+
"event_input": "",
38244+
"create_time": "2024-04-01 03:51:29",
38245+
"update_time": "2024-04-01 03:51:29",
38246+
"event_output": null,
38247+
"custom_field_type": null,
38248+
"syntactic_sugar": null,
38249+
"readonly": 1,
38250+
"html_attribute": 0,
38251+
"trigger_elements": "",
38252+
"deprecated": 0,
38253+
"version": "",
38254+
"test_description": null,
38255+
"support_default_value": 0,
38256+
"field_category_text": "Props",
38257+
"platform_framework_text": [
38258+
"React(PC)"
38259+
],
38260+
"field_type_text": [
38261+
"Boolean"
38262+
]
38263+
},
3819038264
{
3819138265
"id": 683,
3819238266
"platform_framework": [

0 commit comments

Comments
 (0)