1.9 KiB
1.9 KiB
调用方式
- 视图调用
<v-tabs
:tabs="[1,2,3,4]"
height="45px"
v-model="activeTab"
color="#333"
activeColor="#1abc9c"
fontSize="14px"
activeFontSize="16px"
:lineHeight="4px"
:lineScale="0.8"
lineColor="#1abc9c"
/>
- js 调用
import vTabs from '@/components/v-tabs'
export default {
components: {
vTabs,
},
data() {
activeTab: 0
},
}
- 参数说明
| 参数 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| value | String 或 Number | 0 | 必传 |
| tabs | Array | [] | tabs 数量 |
| height | String | '45px' | tab 高度 |
| backgroundColor | String | '' | 选中背景 |
| borderRadius | String | 5px | 圆角 |
| color | String | #333333 | 默认文字颜色 |
| activeColor | String | #333333 | 选中文字颜色 |
| fontSize | String | 14px | 默认文字大小 |
| activeFontSize | String | 14px | 选中文字大小 |
| lineScale | Number | 0.6 | 下划线缩放 |
| lineHeight | [Number, String] | 3 | 下划线高度 |
| lineColor | Sring | #007AFF | 下划线颜色 |
事件
| 事件名称 | 参数 |
|---|---|
| @change | activeTab |
更新日志
2020-06-09
- 修复小程序端选中的下划线不显示问题
- 新增 tab 高度设置
lineHeight修改为只支持String方式
2020-06-11
- 添加
change事件 - 修复插件内容问题
- 修复下划线不居中问题
2020-06-11
- 添加注释
- 修复 bug
2020-07-05
- 新增
padding的可配置 - 修复
v-model双向绑定问题 - 修复初始化下划线没定位的为题