npm.io
0.0.3 • Published 6 years ago

ac-drawer

Licence
MIT
Version
0.0.3
Deps
2
Size
39 kB
Vulns
0
Weekly
0

ac-drawer

npm version NPM downloads

1. 简介

一个基于react的抽屉组件,可以从上下左右这些侧面弹出一个层,显示特定的内容

2. 安装
npm install ac-drawer -S
3. 使用
import Drawer from 'ac-drawer';
import 'ac-drawer/dist/ac-drawer.css';
<Drawer title={'basic drawer'} show={true} placement={'right'} onClose={this.fCloseDrawer}>
    <div className="con">
        <p>这是第一行文字</p>
        <p>这是第二行文字</p>
        <p>这是第三行文字,啦啦啦~</p>                                                 
    </div>
</Drawer>

更多用法可以参考demo文件夹中的示例

4. 预览
5. 参数
Parameter Type Default Description
show string 是否显示抽屉组件
placement string right 抽屉的位置。有四个预置的选项: left,right,top,bottom
hasHeader boolean true 是否显示抽屉的头部
title string 抽屉的头部的标题
className string 抽屉容器的class, 用来自定义组件样式
showMask boolean true 是否显示遮罩
maskClosable boolean false 点击遮罩是否可以关闭抽屉
zIndex number 100000 抽屉容器的层级,可以修改层级
showClose boolean false 是否显示关闭按钮
width number string 抽屉的宽度
height number string 抽屉的高度
destroyOnClose boolean 关闭时候是否销毁抽屉的内容