# 折叠面板 - Collapse
# 可多选版 Collapse 预览及使用方法
标题1
标题2
标题3
<g-collapse :selected.sync="selectedTab">
<g-collapse-item title="标题1" name="1">内容1</g-collapse-item>
<g-collapse-item title="标题2" name="2">内容2</g-collapse-item>
<g-collapse-item title="标题3" name="3">内容3</g-collapse-item>
</g-collapse>
data(){ return{ selectedTab : ['1'] } },
# 相关提示:
# 1、必选参数
Collapse
组件必须接受两个参数: title
用于显示折叠面板的标题。 name
用于表示选中的 item
。
# 2、selectedTab
该属性用于设置 Collapse
组件默认打开的选项卡。
# 单选 Collapse 预览及使用方法
标题1
标题2
标题3
<g-collapse :selected.sync="selectedTab" single>
<g-collapse-item title="标题1" name="1">内容1</g-collapse-item>
<g-collapse-item title="标题2" name="2">内容2</g-collapse-item>
<g-collapse-item title="标题3" name="3">内容3</g-collapse-item>
</g-collapse>
data(){ return{ selectedTab : ['1'] } },
# 1、single
通过添加 single
属性来设置单选版效果,即同时只能打开一个选项卡,默认 false
。