PageModal

继承自 SlideModal 组件,属于 Modal 系列。

Install

1. npm install beeshell

Usage

引入方式

全部引入

1. import { PageModal } from 'beeshell';

单独引入

1. import PageModal from 'beeshell/modules/PageModal';

Examples

image

在 SlideModal 基础上做的扩展,提供了规范化的头部,包含标题,确定、取消按钮,body 部分自定义。

Code

1. import { PageModal } from 'beeshell';

3. class App extends React.Component {
4. render() {
5. <View>
6. <TouchableOpacity
7. onPress={() => {
8. this._pageModal.open();
9. }}>
10. <Text>带头部的底部上拉</Text>
11. </TouchableOpacity>

13. <PageModal
14. ref={(c) => { this._pageModal = c; }}
15. title="选择品类"
16. cancelable={true}
17. cancelCallback={() => {
18. }}
19. confirmCallback={() => {
20. }}>

22. <Text>ref 获取组件实例</Text>
23. <Text>title="标题"</Text>
24. <Text>
25. cancelCallback={'{'}() => {'{'}{'}'} {'}'}
26. '取消'回调
27. </Text>
28. <Text>
29. confirmCallback={'{'}() => {'{'}{'}'} {'}'}
30. '确认'回调
31. </Text>
32. </PageModal>
33. </View>
34. }
35. }

Props

Name Type Required Default Description
cancelable Boolean false true 点击蒙层是否消失
title String false ‘标题’ 标题
cancelCallback Function false null 取消按钮点击回调
confirmCallback Function false null 确认按钮点击回调
confirmText String false ‘ 完成’ 完成按钮文字

Methods

.open()

打开弹窗。

1. this._pageModal.open();

.close()

关闭弹窗。

1. this._pageModal.close();

其他

继承 SlideModal 组件的所有 Props、Methods。