# Tab <small>标签</small>

:::tip
`Tab` 组件需要配合 [`Tabs`](./tabs) 组件使用。
:::

## 示例

见 [`Tabs` 示例](./tabs#示例)。

## API

### 属性

| 名称 | 类型 | 默认值 | 描述 |
| -- | -- | -- | -- |
| `label` | `string` | - | 选项卡文本。 |
| `name` | `string` | - | 选项卡名称。 |
| `disabled` | `boolean=` | `false` | 选项卡是否禁用。 |
| `to` | `string|Object` | - | [^to] |
| `matches` | `function(Route, Route): boolean` | - | [^matches] |
| `native` | `boolean` | `false` | 路由模式是否强制使用原生的 `<a>` 元素。 |
| `removable` | `boolean` | | 是否可删除。 |
| `status` | `string` | - | [^status] |

^^^to
选项卡路由信息。类型见 [`Link`](./link#属性) 组件的同名属性。如果 `to` 存在，则 `name` 属性将被忽略。

:::tip
如果使用了 Vue Router，当前被激活的状态将与 `$route` 对象自动匹配，无需在 [`Tabs`](./tabs) 组件中手动控制 `index` 或 `active`。
:::
^^^

^^^matches
在使用了 Vue Router 且提供了 `to` 属性后，用于自定义判断路由当前激活 `Tab` 的逻辑。参数列表为 `(current: Route, to: Route)`。`current` 与 `to` 参数均为 Vue Router 的 [`Route`](https://router.vuejs.org/zh/api/#%E8%B7%AF%E7%94%B1%E5%AF%B9%E8%B1%A1%E5%B1%9E%E6%80%A7) 类型对象。默认使用上层 [`Tabs`](./tabs) 组件的 `matches` 逻辑。
^^^

^^^status
选项卡状态。

+++枚举值
| 值 | 描述 |
| -- | -- |
| `success` | 成功状态。 |
| `warning` | 警示状态。 |
| `info` | 普通信息状态。 |
| `error` | 错误状态。 |
+++
^^^

### 插槽

| 名称 | 描述 |
| -- | -- |
| `default` | 默认插槽。 |
| `item` | 标签选项卡内容，包括对应的按钮/链接。 |
| `label` | 标签选项卡文本。 |