Taro React组件使用（1） —— Overlay 遮罩层【渐入渐出动画遮罩层】

Overlay 遮罩层

---

提供一个简单的 Overlay 遮罩层，在页面上的层级为 1026;

1. 使用指南

在 Taro 文件中引入组件，将组件放入src下的components文件夹中

import RuiOverlay from "../../components/RuiOverlay/RuiOverlay";

2. 基础用法

2.1 组件使用

{/* 基本案例 */}
<RuiOverlay isOpened={isShowBase}
  onClose={() => { this.setState({ isShowBase: false }) }} />

2.2 显示遮罩层

<View className="rui-flex-ac rui-list-item"
  onClick={() => { this.setState({isShowBase: true}) }}>
  <Text className="rui-fs30 rui-fg">基本案例</Text>
  <Text className="rui-icon rui-icon-arrow-right rui-fa rui-fs30"></Text>
</View>

3. 嵌入内容居中

3.1 组件使用