Accordion使用说明
项目简介
本项目为折叠面板(http://nature.beisen.co/spec/naturedesign-1.6.2/#p=折叠面板)。对本项目有任何疑问或建议,欢迎联系~(邮箱:mengshuai@beisen.com)
项目运行
-
cnpm install 或 npm install cnpm使用教程
-
npm run dev (开发环境打包 port:8080)
-
npm run test (测试用例)
-
npm run build (生产环境打包)
PopLayer参数
{
"hidden":true //是否使用组件
,children:[
{
"panelTitle":"折叠面板01"
,content:<h1>xxxxxxxxxxxx</h1> //内容区域调用的组件或者html
},
{
"panelTitle":"折叠面板02"
,content:'111111'
},
{
"panelTitle":"折叠面板03"
,content:'111111'
},
{
"panelTitle":"折叠面板04"
,content:'111111'
},
{
"panelTitle":"折叠面板05"
,content:'111111'
}
]
,showIndex: 0 //第几个展开,0为默认为第1个折叠面板展开
}
}
Accordion调用方法
1.安装npm组件包
npm install @beisen/Accordion --save-dev
2.引用组件
import Accordion from "@beisen/Accordion"
3.传入参数
该参数为上述参数,传入方式使用: {...参数}
data: {
"hidden":true //是否显示
,children:[
{
"panelTitle":"折叠面板01"
,content:<h1>xxxxxxxxxxxx</h1> //内容区域调用的组件或者html
},
{
"panelTitle":"折叠面板02"
,content:'111111'
},
{
"panelTitle":"折叠面板03"
,content:'111111'
},
{
"panelTitle":"折叠面板04"
,content:'111111'
},
{
"panelTitle":"折叠面板05"
,content:'111111'
}
]
,showIndex: 0 //第几个展开,0为默认为第1个折叠面板展开
}
render () {
return (
<Accordion {...this.state.data}/>
)
}