0.1.0 • Published 6 years ago
lm-drawer v0.1.0
drawer
- 作者:caoxuewei
- 邮箱:caoxuewei@58ganji.com
- 版本:
0.2.0
介绍
侧滑导航
安装
lm-*
组件使用 npm
进行管理,命名空间统一为 lm-
,请使用以下命令进行组件安装。
npm i lm-drawer --save
- 如果你还没有安装
npm
,可通过以下方式进行 安装。 - 安装cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org
使用
样例文档
- 待开发
使用
最少配置参数为:
- 不传任何东西
<Drawer />
- 传title
<Drawer
title="drawer demo"
/>
- 传菜单数组
navs: [
{
content: '导航一',
func: () => {
this.setState({
content: '导航一'
})
},
custCls: 'emoji-1',
child:(<div>child</div>)
},
{
content: '导航二',
func: () => {
this.setState({
content: '导航二'
})
},
custCls: 'emoji-2'
},
{
content: '导航三',
func: () => {
this.setState({
content: '导航三'
})
},
custCls: 'emoji-3'
}
]
<Drawer
title="drawer demo"
navs={navs}
/>
配置参数
Prop | Type | Default | Description |
---|---|---|---|
title | string | | 导航标题 | |
panelWidth | number | 40 | 侧滑导航的宽度,0~100 |
opacity | number | .3 | mask的透明度 |
navs | array | [] | 菜单栏的条目,例如:[{content:'导航', func: () => {}, custCls:'自定义类'}] ,其中,content是菜单的条目的名称,func是点击的回调函数,custCls是用户对条目的自定义类 |
注意事项
- 组件注意事项
开发调试
进入项目目录后,使用 node
命令启动服务
npm run start
打包发布可通过 node
命令执行
npm run build
npm publish
相关资料
Changelog
0.1.0
- init
0.1.0
update react to v16
0.1.0
6 years ago