uxcore-collapse

2.2.0 • Public • Published

uxcore-collapse Dependency Status devDependency Status

TL;DR

uxcore-collapse ui component for react

Setup develop environment

$ git clone https://github.com/uxcore/uxcore-collapse && cd uxcore-collapse
$ npm install
$ npm start

Usage

<Collapse defaultActiveKey={["1"]} onChange={callback}>
    <Panel header={`This is panel header 1`} key="1">
        <p>{text}</p>
    </Panel>
    <Panel header={`This is panel header 2`} key="2">
        <p>{text}</p>
    </Panel>
    <Panel header={`This is panel header 3`} key="3">
        <p>{text}</p>
    </Panel>
</Collapse>

Demo

http://uxco.re/components/collapse/

API

Props

Collapse

配置项 类型 必填 默认值 功能/备注
prefixCls string optional kuma-collapse 默认类名,用户可以通过修改此项来完成样式的定制
activeKey array/string optional the first panel key 当前激活面板的 key 默认无,accordion 模式下默认第一个元素
defaultActiveKey array/string optional null 初始化选中面板的 key
accordion bool optional false 手风琴模式
onChange function optional (key,activeKey)=>{} 切换面板的回调,参数 key 为当前变动的面板,activeKey 为所有激活的面板

Collapse.Panel

配置项 类型 必填 默认值 功能/备注
key string optional index 当前面板的 key
prefixCls string optional Collapse.prefixCls 默认类名,用户可以通过修改此项来完成样式的定制
header string/number/node optional null 面板头内容
isActive bool optional false 面板当前是否展开,true 表示展开
onItemClick function optional (isActive, e)=>{} 面板头点击事件

Dependencies (7)

Dev Dependencies (11)

Package Sidebar

Install

npm i uxcore-collapse

Weekly Downloads

11

Version

2.2.0

License

MIT

Unpacked Size

36.4 kB

Total Files

24

Last publish

Collaborators

  • taoqili
  • xiaowuming
  • vincent.bian
  • eternalsky
  • doubaozia
  • ex90rts
  • yeson