一个简易的弹窗组件
优势
- 深入解决了页面穿透问题,免除您H5弹窗页面穿透问题的困扰
- 交互更加流畅,目前提供了6种简易动画,可随意选用
效果
用法
- 安装
- npm i --save easy-modal-honghong
- 引用
-
import Modal from 'easy-modal-honghong'
-
<Modal visible={visible} onCancel={() => this.handleCancel()} flashType="move-right" > <div>弹层内容</div> </Modal>
- 参数说明
- visible:boolean 用于控制弹窗展示/隐藏
- onCancel:()=>void 关闭弹窗后的回调
- flashType:string 弹窗交互的动画类型,如下
- 默认 fade
- fade 淡入淡出
- zoom 从中间打开,到中间消失
- move-down 从下方进入,向下方消失
- move-up 从上方进入,向上方消失
- move-left 从左方进入,向左方消失
- move-right 从右方进入,向右方消失