@sirl/smart_tabs

1.0.1 • Public • Published

smart_tabs

介绍

小程序tabs组件库,下划线动态跟随点击位置

使用说明

  1. 项目根目录引入 yarn add @sirl/smart_tabs
  2. 构建npm
  3. 组件注册 "usingComponents": {"tabs": "@sirl/smart_tabs/tabs"}
  4. 组件使用
    1. 页面使用
    <tabs  bind:onChange="change_active_handle" index="{{current}}" tabs="{{tabs}}" active="{{active}}" />
    
    1. 属性
    tabs:[
        title:'标题',
        active:'', //激活项
    ],
    active:'', //激活项目,可以使用id
    index:'', //轮播当前所在索引
    lineWidth:64, //线条宽度,Number类型,单位为px
    lineHeight:32, //线条高度,Number类型,单位为px,
    borderRadius:3, //线条borderRadius,Number类型,单位为px,
    lineColor:'#FF5D62', //线条颜色
    activeStyle:'color:blue,'//激活状态下选项卡样式,
    customStyle:'color:red', //普通状态下选项卡样式
    change_active_handle(e){
     const {
      active,   //激活项
      index     //所在位置,可以与swiper配合
    } = e.detail;
    
    }
    

参与贡献

  1. Fork 本仓库
  2. 新建 Feat_xxx 分支
  3. 提交代码
  4. 新建 Pull Request

Readme

Keywords

none

Package Sidebar

Install

npm i @sirl/smart_tabs

Weekly Downloads

0

Version

1.0.1

License

ISC

Unpacked Size

6.7 kB

Total Files

8

Last publish

Collaborators

  • sirl