Collapse 折叠面板
用于将内容收纳在可折叠的面板中,聚焦关键信息。
基础用法
可同时展开多个
包括团队、里程碑与预算等基础信息。
组件库基于 Web Components 标准构建。
按版本迭代,每个版本发布前执行工程纪律清单。
通过 active 控制展开的面板集合(name 逗号分隔),默认可同时展开多个。
手风琴
手风琴模式
同一时间仅展开一个面板。
展开新的面板会自动收起上一个。
再次点击已展开面板可全部收起。
全部收起
默认全部收起
默认状态全部收起。
点击标题展开。
事件
展开状态事件
内容一
内容二
当前展开:a
API
oas-collapse
| 属性 | 说明 | 类型 | 默认值 |
|---|---|---|---|
accordion | 手风琴模式,同时仅展开一项 | boolean | — |
active | 展开项 name 集合(逗号分隔) | string | — |
| 事件 | 说明 |
|---|---|
oas-change | 展开状态变化,detail: { active: string[] } |
| 名称 | 说明 |
|---|---|
| 默认 | — |
oas-collapse-item
| 属性 | 说明 | 类型 | 默认值 |
|---|---|---|---|
header | 面板标题 | string | — |
name | 面板唯一标识 | — | — |
open | 是否展开(由容器托管) | — | — |
| 事件 | 说明 |
|---|---|
oas-collapse-item-click | — |
| 名称 | 说明 |
|---|---|
| 默认 | — |