UNPKG

3.43 kBTypeScriptView Raw
1import { ComponentType } from 'react'
2import { StandardProps, CommonEventFunction } from './common'
3interface 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}
101declare 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 */
130declare const PageContainer: ComponentType<PageContainerProps>
131export { PageContainer, PageContainerProps }