# lui-tabs

## TabsComponent

## 使用场景

课程共创-tabs组件

## 项目中用到的地方

课程共创-微课样课-点击其中一个（弹框）

## 代码示例

```html
 <lui-tabs class="work-tabs" [itemList]="tablist" (exportCurTab)="getCurTab($event)">
        <div class="work-syllabus" *ngIf="curTab.type == 'syllabus'">
            <lui-ugc-syllabus [data]="chaptors" (upUrl)="getCurChaptorUrl($event)"></lui-ugc-syllabus>
        </div>
        <div class="work-comment" *ngIf="curTab.type == 'comment'">
            <lui-comment-box [paginationSize]="'s'" [includeTitle]="false"
                        [cmtParams]="cmtParams"></lui-comment-box>
        </div>
</lui-tabs>
    <lui-tabs class="work-tabs" [itemList]="tablist" (exportCurTab)="getCurTab($event)">
        <div class="work-syllabus" *ngIf="curTab.type == 'syllabus'">
            <lui-ugc-syllabus [data]="chapterData" (upUrl)="getCurChaptorUrl($event)"></lui-ugc-syllabus>
        </div>
    </lui-tabs>
```

## API

### 属性

| 参数         | 说明         | 类型   | 默认值 |
| ------------ | ------------ | ------ | ------ |
| `[itemList]` | 是否显示组件 | `List` | `[]`   |

### itemList中的obj属性

| 参数       | 说明          | 类型     | 默认值 |
| ---------- | ------------- | -------- | ------ |
| `obj.name` | tab对应的名称 | `String` | ---    |
| `obj.id`   | tab对应的id   | `Number` | ---    |