Skip to content

Commit 52e362f

Browse files
feat(Overlay): add overlay animation series callback func (#617)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
1 parent 6567911 commit 52e362f

File tree

9 files changed

+204
-0
lines changed

9 files changed

+204
-0
lines changed

db/TDesign.db

0 Bytes
Binary file not shown.

packages/products/tdesign-mobile-react/src/overlay/overlay.en-US.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,3 +15,7 @@ preventScrollThrough | Boolean | true | \- | N
1515
visible | Boolean | false | \- | N
1616
zIndex | Number | 1000 | \- | N
1717
onClick | Function | | Typescript:`(context: { e: MouseEvent }) => void`<br/> | N
18+
onClose | Function | | Typescript:`() => void`<br/> | N
19+
onClosed | Function | | Typescript:`() => void`<br/> | N
20+
onOpen | Function | | Typescript:`() => void`<br/> | N
21+
onOpened | Function | | Typescript:`() => void`<br/> | N

packages/products/tdesign-mobile-react/src/overlay/overlay.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,3 +15,7 @@ preventScrollThrough | Boolean | true | 防止滚动穿透,即不允许点击
1515
visible | Boolean | false | 是否展示 | N
1616
zIndex | Number | 1000 | 遮罩的层级 | N
1717
onClick | Function | | TS 类型:`(context: { e: MouseEvent }) => void`<br/>遮罩层的点击事件 | N
18+
onClose | Function | | TS 类型:`() => void`<br/>遮罩执行消失动画效果前触发 | N
19+
onClosed | Function | | TS 类型:`() => void`<br/>遮罩消失动画效果结束后触发 | N
20+
onOpen | Function | | TS 类型:`() => void`<br/>遮罩执行弹出动画效果前触发 | N
21+
onOpened | Function | | TS 类型:`() => void`<br/>遮罩弹出动画效果结束后触发 | N

packages/products/tdesign-mobile-react/src/overlay/type.ts

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,4 +41,20 @@ export interface TdOverlayProps {
4141
* 遮罩层的点击事件
4242
*/
4343
onClick?: (context: { e: MouseEvent<HTMLDivElement> }) => void;
44+
/**
45+
* 遮罩执行消失动画效果前触发
46+
*/
47+
onClose?: () => void;
48+
/**
49+
* 遮罩消失动画效果结束后触发
50+
*/
51+
onClosed?: () => void;
52+
/**
53+
* 遮罩执行弹出动画效果前触发
54+
*/
55+
onOpen?: () => void;
56+
/**
57+
* 遮罩弹出动画效果结束后触发
58+
*/
59+
onOpened?: () => void;
4460
}

packages/products/tdesign-mobile-vue/src/overlay/overlay.en-US.md

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,9 +13,17 @@ preventScrollThrough | Boolean | true | \- | N
1313
visible | Boolean | false | \- | N
1414
zIndex | Number | 1000 | \- | N
1515
onClick | Function | | Typescript:`(context: { e: MouseEvent }) => void`<br/> | N
16+
onClose | Function | | Typescript:`() => void`<br/> | N
17+
onClosed | Function | | Typescript:`() => void`<br/> | N
18+
onOpen | Function | | Typescript:`() => void`<br/> | N
19+
onOpened | Function | | Typescript:`() => void`<br/> | N
1620

1721
### Overlay Events
1822

1923
name | params | description
2024
-- | -- | --
2125
click | `(context: { e: MouseEvent })` | \-
26+
close | \- | \-
27+
closed | \- | \-
28+
open | \- | \-
29+
opened | \- | \-

packages/products/tdesign-mobile-vue/src/overlay/overlay.md

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,9 +13,17 @@ preventScrollThrough | Boolean | true | 是否阻止背景滚动,阻止时蒙
1313
visible | Boolean | false | 是否展示 | N
1414
zIndex | Number | 1000 | 遮罩的层级 | N
1515
onClick | Function | | TS 类型:`(context: { e: MouseEvent }) => void`<br/>遮罩层的点击事件 | N
16+
onClose | Function | | TS 类型:`() => void`<br/>遮罩执行消失动画效果前触发 | N
17+
onClosed | Function | | TS 类型:`() => void`<br/>遮罩消失动画效果结束后触发 | N
18+
onOpen | Function | | TS 类型:`() => void`<br/>遮罩执行弹出动画效果前触发 | N
19+
onOpened | Function | | TS 类型:`() => void`<br/>遮罩弹出动画效果结束后触发 | N
1620

1721
### Overlay Events
1822

1923
名称 | 参数 | 描述
2024
-- | -- | --
2125
click | `(context: { e: MouseEvent })` | 遮罩层的点击事件
26+
close | \- | 遮罩执行消失动画效果前触发
27+
closed | \- | 遮罩消失动画效果结束后触发
28+
open | \- | 遮罩执行弹出动画效果前触发
29+
opened | \- | 遮罩弹出动画效果结束后触发

packages/products/tdesign-mobile-vue/src/overlay/props.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -37,4 +37,12 @@ export default {
3737
},
3838
/** 遮罩层的点击事件 */
3939
onClick: Function as PropType<TdOverlayProps['onClick']>,
40+
/** 遮罩执行消失动画效果前触发 */
41+
onClose: Function as PropType<TdOverlayProps['onClose']>,
42+
/** 遮罩消失动画效果结束后触发 */
43+
onClosed: Function as PropType<TdOverlayProps['onClosed']>,
44+
/** 遮罩执行弹出动画效果前触发 */
45+
onOpen: Function as PropType<TdOverlayProps['onOpen']>,
46+
/** 遮罩弹出动画效果结束后触发 */
47+
onOpened: Function as PropType<TdOverlayProps['onOpened']>,
4048
};

packages/products/tdesign-mobile-vue/src/overlay/type.ts

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,4 +39,20 @@ export interface TdOverlayProps {
3939
* 遮罩层的点击事件
4040
*/
4141
onClick?: (context: { e: MouseEvent }) => void;
42+
/**
43+
* 遮罩执行消失动画效果前触发
44+
*/
45+
onClose?: () => void;
46+
/**
47+
* 遮罩消失动画效果结束后触发
48+
*/
49+
onClosed?: () => void;
50+
/**
51+
* 遮罩执行弹出动画效果前触发
52+
*/
53+
onOpen?: () => void;
54+
/**
55+
* 遮罩弹出动画效果结束后触发
56+
*/
57+
onOpened?: () => void;
4258
}

packages/scripts/api.json

Lines changed: 140 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -83672,6 +83672,146 @@
8367283672
],
8367383673
"field_type_text": []
8367483674
},
83675+
{
83676+
"id": 1746694169,
83677+
"platform_framework": [
83678+
"8",
83679+
"16"
83680+
],
83681+
"component": "Overlay",
83682+
"field_category": 2,
83683+
"field_name": "close",
83684+
"field_type": [],
83685+
"field_default_value": "",
83686+
"field_enum": "",
83687+
"field_desc_zh": "遮罩执行消失动画效果前触发",
83688+
"field_desc_en": null,
83689+
"field_required": 0,
83690+
"event_input": "",
83691+
"create_time": "2025-05-08 08:49:29",
83692+
"update_time": "2025-05-08 08:49:29",
83693+
"event_output": null,
83694+
"custom_field_type": null,
83695+
"syntactic_sugar": null,
83696+
"readonly": 1,
83697+
"html_attribute": 0,
83698+
"trigger_elements": "",
83699+
"deprecated": 0,
83700+
"version": "",
83701+
"test_description": null,
83702+
"support_default_value": 0,
83703+
"field_category_text": "Events",
83704+
"platform_framework_text": [
83705+
"Vue(Mobile)",
83706+
"React(Mobile)"
83707+
],
83708+
"field_type_text": []
83709+
},
83710+
{
83711+
"id": 1746694152,
83712+
"platform_framework": [
83713+
"8",
83714+
"16"
83715+
],
83716+
"component": "Overlay",
83717+
"field_category": 2,
83718+
"field_name": "closed",
83719+
"field_type": [],
83720+
"field_default_value": "",
83721+
"field_enum": "",
83722+
"field_desc_zh": "遮罩消失动画效果结束后触发",
83723+
"field_desc_en": null,
83724+
"field_required": 0,
83725+
"event_input": "",
83726+
"create_time": "2025-05-08 08:49:12",
83727+
"update_time": "2025-05-08 08:49:12",
83728+
"event_output": null,
83729+
"custom_field_type": null,
83730+
"syntactic_sugar": null,
83731+
"readonly": 1,
83732+
"html_attribute": 0,
83733+
"trigger_elements": "",
83734+
"deprecated": 0,
83735+
"version": "",
83736+
"test_description": null,
83737+
"support_default_value": 0,
83738+
"field_category_text": "Events",
83739+
"platform_framework_text": [
83740+
"Vue(Mobile)",
83741+
"React(Mobile)"
83742+
],
83743+
"field_type_text": []
83744+
},
83745+
{
83746+
"id": 1746694183,
83747+
"platform_framework": [
83748+
"8",
83749+
"16"
83750+
],
83751+
"component": "Overlay",
83752+
"field_category": 2,
83753+
"field_name": "open",
83754+
"field_type": [],
83755+
"field_default_value": "",
83756+
"field_enum": "",
83757+
"field_desc_zh": "遮罩执行弹出动画效果前触发",
83758+
"field_desc_en": null,
83759+
"field_required": 0,
83760+
"event_input": "",
83761+
"create_time": "2025-05-08 08:49:43",
83762+
"update_time": "2025-05-08 08:49:43",
83763+
"event_output": null,
83764+
"custom_field_type": null,
83765+
"syntactic_sugar": null,
83766+
"readonly": 1,
83767+
"html_attribute": 0,
83768+
"trigger_elements": "",
83769+
"deprecated": 0,
83770+
"version": "",
83771+
"test_description": null,
83772+
"support_default_value": 0,
83773+
"field_category_text": "Events",
83774+
"platform_framework_text": [
83775+
"Vue(Mobile)",
83776+
"React(Mobile)"
83777+
],
83778+
"field_type_text": []
83779+
},
83780+
{
83781+
"id": 1746694194,
83782+
"platform_framework": [
83783+
"8",
83784+
"16"
83785+
],
83786+
"component": "Overlay",
83787+
"field_category": 2,
83788+
"field_name": "opened",
83789+
"field_type": [],
83790+
"field_default_value": "",
83791+
"field_enum": "",
83792+
"field_desc_zh": "遮罩弹出动画效果结束后触发",
83793+
"field_desc_en": null,
83794+
"field_required": 0,
83795+
"event_input": "",
83796+
"create_time": "2025-05-08 08:49:54",
83797+
"update_time": "2025-05-08 08:49:54",
83798+
"event_output": null,
83799+
"custom_field_type": null,
83800+
"syntactic_sugar": null,
83801+
"readonly": 1,
83802+
"html_attribute": 0,
83803+
"trigger_elements": "",
83804+
"deprecated": 0,
83805+
"version": "",
83806+
"test_description": null,
83807+
"support_default_value": 0,
83808+
"field_category_text": "Events",
83809+
"platform_framework_text": [
83810+
"Vue(Mobile)",
83811+
"React(Mobile)"
83812+
],
83813+
"field_type_text": []
83814+
},
8367583815
{
8367683816
"id": 76,
8367783817
"platform_framework": [

0 commit comments

Comments
 (0)