更新记录
2.0.4(2021-11-26) 下载此版本
给事件添加了下标参数
2.0.3(2021-11-02) 下载此版本
简化options,去掉了id字段,保留唯一的text用来展示 tab选项卡的标语
2.0.2(2021-11-01) 下载此版本
修改bug:在微信端背景颜色自定义失败(已修复)
查看更多平台兼容性
uni-app
Vue2 | Vue3 | Chrome | Safari | app-vue | app-nvue | Android | iOS | 鸿蒙 |
---|---|---|---|---|---|---|---|---|
√ | - | - | - | - | - | - | - | - |
微信小程序 | 支付宝小程序 | 抖音小程序 | 百度小程序 | 快手小程序 | 京东小程序 | 鸿蒙元服务 | QQ小程序 | 飞书小程序 | 快应用-华为 | 快应用-联盟 |
---|---|---|---|---|---|---|---|---|---|---|
- | - | - | - | - | - | - | - | - | - | - |
前言
你们的使用、评论与收藏,是我更新组件的动力。同时我会尽量保证代码的简洁性,让你们能读懂源码,希望我的组件源码,能给到你们一些学习上的帮助,谢谢
使用方法
直接引入
复制代码<letsgofishing-Tab></letsgofishing-Tab>
这样引入后就会出现右边展示图的第一个图片
属性
参数 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
color | 标签激活时下划线颜色,字体颜色同步 | string | - | #2979ff |
bgColor | 组件的背景色 | string | - | #fff |
options | 传入组件的标签数据 | array | - | [{id:0,text:选项卡0},{id:1,text:选项卡1}] |
事件
事件 | 说明 |
---|---|
@getTab(event,index) | 获取当前被点击的 tab 信息 |
值示例
复制代码<letsgofishing-Tab options="options"></letsgofishing-Tab>
options: {
required: true,
default: () => [{
text: '选项卡0'
}, {
text: '选项卡1'
}, {
text: '选项卡2'
}]
}