Accordion使用说明

项目简介

本项目为折叠面板（http://nature.beisen.co/spec/naturedesign-1.6.2/#p=折叠面板）。对本项目有任何疑问或建议，欢迎联系~(邮箱：[email protected])

项目运行

1. cnpm install 或 npm install cnpm使用教程

2. npm run dev （开发环境打包 port:8080）

3. npm run test （测试用例）

4. 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}/>     
  )
}