PageModal
继承自 SlideModal 组件,属于 Modal 系列。
Install
1. npm install beeshell
Usage
引入方式
全部引入
1. import { PageModal } from 'beeshell';
单独引入
1. import PageModal from 'beeshell/modules/PageModal';
Examples

在 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。
