UNPKG

@uiw/react-native

Version:
64 lines (56 loc) 1.26 kB
MaskLayer 遮罩层 --- 用于模态对话框,中的遮罩层。 ### 基础示例 <!--DemoStart--> ```jsx import React, { Component, Fragment } from 'react'; import { View, Text, Alert, SafeAreaView } from 'react-native'; import { Modal, Button, MaskLayer } from '@uiw/react-native'; export default () => { const [visible, setVisible] = useState(true); return ( <Fragment> <MaskLayer visible={visible} onDismiss={() => { setVisible(false); }}> <Text style={{color: '#fff'}}>展示内容</Text> </MaskLayer> <Button onPress={() => { setVisible(true); }}> {visible ? '隐藏模态框' : '显示模态框'} </Button> </Fragment> ); } ``` <!--End--> ## Props 继承原生 Modal 属性 [`ModalProps`](https://facebook.github.io/react-native/docs/modal.html#props) ```typescript interface MaskLayerProps extends RNModalProps { /** * 遮罩层是否禁止点击 * defult: `true` */ maskClosable?: boolean; /** * 是否隐藏 */ visible?: boolean; /** * 遮罩层透明度 * defult: `0.6` */ opacity?: number; /** * 隐藏消除回调事件 */ onDismiss?: () => void; children?: JSX.Element; } ```