@beisen/DropDownButton
v0.1.48
Published
DropDownButton
Downloads
31
Maintainers
Readme
DropDownButton 使用说明
项目运行
cnpm install 或 npm install cnpm使用教程
npm run dev (开发环境打包 port:8080)
npm run test (测试用例)
npm run build (生产环境打包)
DropDownButton参数
{
"title":"测试" //下拉按钮上的文字
,"type":"icon" //下拉按钮上的文字类型 是文本,还是icon
,"bsSize":"default" /**按钮尺寸(string)。参数:
1.默认:“default”
2.小按钮:“small”
**/
,"bsStyle":"default" /**按钮类型(string)。参数:
1.默认:者“default”
2.弱化按钮:“weaken”
**/
,"children":[
{
"value":0
,"text":"查看详情"
,"active":false
,"isChecked":false
}
,{
"value":1
,"text":"性质维度"
,"active":false
,"isChecked":false
}
,{
"value":2
,"text":"地域维度"
,"active":false
,"isChecked":false
}
,{
"value":3
,"text":"包含下属"
,"active":false
,"isChecked":true
}
,{
"value":4
,"text":"不包含下属"
,"active":false
,"isChecked":false
}
] /** MenuItem **/
,"open":false /** is open or not 首次渲染列表是否已展开**/
,"disabled":false //是否禁用
,"hidden":false //是否显示按钮
,"iconName":"pc-sys-arrowdown-nomal-svg" //icon图标
,"maxWidth":"20px" //最大宽度,默认为"" ,超出后,超出的部门显示...
,"direction":"right-down" /**
MenuList spread direction,one of:
1."left-top"
2."right-top"
3."left-down"
4."right-down"
**/
,"onClick":function(val){console.log(val)} /**点击后时间回调**/
}
DropDownButton调用方法
- 引用组件
import DropDownButton from "./src/index"
- 传入参数
该参数为上述参数,传入方式使用: data={参数}
render () {
return (
<DropDownButton data={this.state.DropdownData} />
)
}