<br />
## 基础用法
通过`active`绑定当前激活标签对应的索引值,默认情况下启用第一个标签。
```
<hd-tabs :active="active">
<hd-tab title="标签页1">标签页1的内容</hd-tab>
<hd-tab title="标签页2">标签页2的内容</hd-tab>
<hd-tab title="标签页3">标签页3的内容</hd-tab>
</hd-tabs>
```
```
export default {
data() {
return {
active: 1,
};
},
};
```
<br />
## 主题 theme
主题属性支持`blue` `green` `pink` `gray`四种盛事通项目统一主题颜色,默认为 blue。
```
<hd-tabs :active="active" theme="green">
<hd-tab title="标签页1">标签页1的内容</hd-tab>
<hd-tab title="标签页2">标签页2的内容</hd-tab>
<hd-tab title="标签页3">标签页3的内容</hd-tab>
</hd-tabs>
```
```
export default {
data() {
return {
active: 1,
};
},
};
```
<br />
### props
|属性名|说明|类型|默认参数|
| --- | --- | --- | --- |
|active|默认选中的tab下标|String|Number|`0`|
|theme|主题色默认支持`blue` `green` `pink` `gray`盛事通四种颜色|String|`blue`|
<br />
### Events
|事件名|说明|回调参数|
| --- | --- | --- |
|click|点击tab时触发|`index : 选中的下标` `title : 选中的标题`|
|change|改变tab时触发|`index : 选中的下标` `title : 选中的标题`|