1 | import { ComponentType } from 'react'
|
2 | import { StandardProps, CommonEventFunction } from './common'
|
3 | interface PageContainerProps extends StandardProps {
|
4 | /** 是否显示容器组件
|
5 | * @default false
|
6 | * @supported weapp, alipay, rn
|
7 | */
|
8 | show?: boolean
|
9 |
|
10 | /** 动画时长,单位毫秒
|
11 | * @default 300
|
12 | * @supported weapp, alipay, rn
|
13 | */
|
14 | duration?: number
|
15 |
|
16 | /** z-index 层级
|
17 | * @default 100
|
18 | * @supported weapp, alipay
|
19 | */
|
20 | zIndex?: number
|
21 |
|
22 | /** 是否显示遮罩层
|
23 | * @default true
|
24 | * @supported weapp, alipay, rn
|
25 | */
|
26 | overlay?: boolean
|
27 |
|
28 | /** 弹出位置,可选值为 top bottom right center
|
29 | * @default bottom
|
30 | * @supported weapp, alipay, rn
|
31 | */
|
32 | position?: keyof PageContainerProps.Position
|
33 |
|
34 | /** 是否显示圆角
|
35 | * @default false
|
36 | * @supported weapp, alipay, rn
|
37 | */
|
38 | round?: boolean
|
39 |
|
40 | /** 自定义遮罩层样式
|
41 | * @supported weapp, alipay, rn
|
42 | */
|
43 | overlayStyle?: string
|
44 |
|
45 | /** 自定义弹出层样式
|
46 | * @supported weapp, alipay, rn
|
47 | */
|
48 | customStyle?: string
|
49 |
|
50 | /** 是否在下滑一段距离后关闭
|
51 | * @supported weapp, alipay
|
52 | * @default false
|
53 | */
|
54 | closeOnSlideDown?: boolean
|
55 |
|
56 | /** 进入前触发
|
57 | * @supported weapp, alipay, rn
|
58 | */
|
59 | onBeforeEnter?: CommonEventFunction
|
60 |
|
61 | /** 进入中触发
|
62 | * @supported weapp, alipay, rn
|
63 | */
|
64 | onEnter?: CommonEventFunction
|
65 |
|
66 | /** 进入后触发
|
67 | * @supported weapp, alipay, rn
|
68 | */
|
69 | onAfterEnter?: CommonEventFunction
|
70 |
|
71 | /** 离开前触发
|
72 | * @supported weapp, alipay, rn
|
73 | */
|
74 | onBeforeLeave?: CommonEventFunction
|
75 |
|
76 | /** 离开中触发
|
77 | * @supported weapp, alipay, rn
|
78 | */
|
79 | onLeave?: CommonEventFunction
|
80 |
|
81 | /** 离开后触发
|
82 | * @supported weapp, alipay, rn
|
83 | */
|
84 | onAfterLeave?: CommonEventFunction
|
85 |
|
86 | /** 点击遮罩层时触发
|
87 | * @supported weapp, alipay
|
88 | */
|
89 | onClickOverlay?: CommonEventFunction
|
90 |
|
91 | /** 进入被打断时触发(通过 a: if 打断时不会触发)。
|
92 | * @supported alipay
|
93 | */
|
94 | onEnterCancelled?: CommonEventFunction
|
95 |
|
96 | /** 离开被打断时触发(通过 a: if 打断时不会触发)。
|
97 | * @supported alipay
|
98 | */
|
99 | onLeaveCancelled?: CommonEventFunction
|
100 | }
|
101 | declare namespace PageContainerProps {
|
102 | /** 弹出位置 */
|
103 | interface Position {
|
104 | /** 上方弹出 */
|
105 | top
|
106 |
|
107 | /** 下方弹出 */
|
108 | bottom
|
109 |
|
110 | /** 右边弹出 */
|
111 | right
|
112 |
|
113 | /** 中央弹出 */
|
114 | center
|
115 | }
|
116 | }
|
117 |
|
118 | /** 页面容器
|
119 | *
|
120 | * 小程序如果在页面内进行复杂的界面设计(如在页面内弹出半屏的弹窗、在页面内加载一个全屏的子页面等),用户进行返回操作会直接离开当前页面,不符合用户预期,预期应为关闭当前弹出的组件。
|
121 | * 为此提供“假页”容器组件,效果类似于 `popup` 弹出层,页面内存在该容器时,当用户进行返回操作,关闭该容器不关闭页面。返回操作包括三种情形,右滑手势、安卓物理返回键和调用 `navigateBack` 接口。
|
122 | *
|
123 | * Bug & Tip
|
124 | * 1. tip: 当前页面最多只有 1 个容器,若已存在容器的情况下,无法增加新的容器
|
125 | * 2. tip: wx.navigateBack 无法在页面栈顶调用,此时没有上一级页面
|
126 | * @classification viewContainer
|
127 | * @supported weapp, alipay, rn
|
128 | * @see https://developers.weixin.qq.com/miniprogram/dev/component/page-container.html
|
129 | */
|
130 | declare const PageContainer: ComponentType<PageContainerProps>
|
131 | export { PageContainer, PageContainerProps }
|