分类导航(展开收起,每行展示的Block自适应)
##多个Block展开收起
#功能描述: 默认显示一行,根据宽度自动匹配显示多少个Block,点击右上角的展开按钮,显示全部Block,再次点击,展示一行。 允许传入每块的内容,展开收起的图标
<CollapsePanel isOpen={false} > {data.map((item) => { return ( <div className={`label-items${item.active ? ' active' : ''}`} key={item.id} onClick={this.doSth.bind(this, item)} > <div className="text"> {item.name} </div> </div> ); })} </CollapsePanel> API
Param | Description | Type | Default value |
---|---|---|---|
isOpen | 默认是否自动展开 | boolean | false |
collapseBtn | 自定义展开收起的结构 | ReactNode | 默认不传以上下箭头的方式显示 |
itemBlockHeight | 自定义每个item的高度 | number | 默认52px |
版权声明:
1、该文章(资料)来源于互联网公开信息,我方只是对该内容做点评,所分享的下载地址为原作者公开地址。2、网站不提供资料下载,如需下载请到原作者页面进行下载。