如果需要监听tab-item的点击事件并取得索引，请使用on-item-click事件:
<tab>
<tab-item @on-item-click="handler"></tab-item>
</tab>
tab
tab
Props
| name | type | default | description | required version |
| line-width | number | 3 | line width | -- |
| active-color | string | selected text color | -- | |
| default-color | string | default text color | -- | |
| disabled-color | string | disabled text color | -- | |
| bar-active-color | string | active color for bar | -- | |
| animate | boolean | true | whether use transition | -- |
| custom-bar-width | string function | set active bar width, like 50px. or you can use function, param is (currentInex) | v2.1.1-rc.7 | |
| badge-label | string | badge label | v2.3.5 | |
| badge-background | string | badge background color | v2.3.5 | |
| badge-color | string | badge font color | v2.3.5 | |
| prevent-default | string | false | whether prevent auto-switching tab-item when tab-item is clicked | v2.7.2 |
| scroll-threshold | number | 4 | scroll tabs threshold | v2.8.1 |
| bar-position | string | bottom | bar position, one of [bottom, top]. only works when animate is true. | v2.9.0 |
tab-item
Variables
tab-item
Props
| name | type | default | description | required version |
| disabled | boolean | false | wheher disabled clicking | -- |
| active-class | string | active classname for current tab-item | -- |
Events
| name | params | description | required version |
| @on-item-click | (index) | emits when current tabItem is clicked | v2.2.1-rc.4 |
Variables
| name | default | description | inherited name |
| @tab-text-disabled-color | #ddd | -- | |
| @tab-text-default-color | #666 | -- | |
| @tab-text-active-color | #04BE02 | -- | @theme-color |
| @tab-bar-active-color | #04BE02 | -- | @theme-color |
Changelog
Releases
- v2.9.1 [fix] fix box-sizing issue #2621. thanks to @suncodeer
- v2.9.0 [feature] support prop:bar-position
- v2.8.1 [feature] support prop:scroll-threshold
- v2.7.2 [feature] support prop:prevent-default #2176
- v2.3.5 [feature] Support badge #1513
- v2.2.1-rc.4 [enhance] Support param:index on event:on-item-click
- v2.1.1-rc.7 [feature] Support setting bar width with prop:custom-bar-width
- v2.1.1-rc.7 [fix] Fix errors when initializing without tab-item #1038 @liu2010y
- v2.1.0-rc.46 [feature] add prop:bar-active-color #715 @greedying