https://github.com/hss01248/wxTabs

tabs for wechat app 微信小程序的多tab实现,各tab页面状态独立
https://github.com/hss01248/wxTabs

Last synced: 3 months ago
JSON representation

tabs for wechat app 微信小程序的多tab实现,各tab页面状态独立

• Host: GitHub
• URL: https://github.com/hss01248/wxTabs
• Owner: hss01248
• License: apache-2.0
• Created: 2017-01-06T08:19:09.000Z (almost 8 years ago)
• Default Branch: master
• Last Pushed: 2017-01-06T08:52:40.000Z (almost 8 years ago)
• Last Synced: 2024-07-17T06:44:18.603Z (4 months ago)
• Language: JavaScript
• Homepage:
• Size: 27.3 KB
• Stars: 49
• Watchers: 6
• Forks: 13
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-github-wechat-app - wxTabs - 微信小程序的多tab实现 (UI组件)
• awesome-github-wechat-weapp - wxTabs - 微信小程序的多tab实现 (UI组件)

README

        
# wxTabs

tabs for wechat app

# 特点:

各页面状态(空白,错误,加载中)已自动处理

页面下拉刷新和上拉加载更多的方法已实现,并封装在tabUtil中,无需在page中书写.

tab之间的切换逻辑已处理.

# 使用时需要做的:

## 拷贝

netUtil.js拷贝到utils目录下

lib文件夹拷贝到根目录下

##  修改

针对具体项目微调netUtil里的一些字段,比如将用于分批加载的pagesize和pageIndex改成自己网络请求里的相应字段.

tab颜色和最小宽度,以及高度可在tabs.wxss里修改.

## 使用(参考pages\index)

写每个页面的wxml和wxss,模板化,并在具体页面导入

```

  

  

    

  

  

  

  

    

      

    

  

```

引入js:

```

var netUtil=require("../../utils/netUtil.js");

var tabUtil=require("../../lib/tab/tabUtil.js");

var lvUtil=require("../../lib/tab/lvUtil.js");

```

调用:

```

 var tabStrs = [' ',' ','推荐','学业成绩','行为问题','亲子关系','人际关系','情绪困扰'];

    tabUtil.initTab(that,tabStrs,2,function(i){

      var params = {};

      params.type=1;

      params.labelIds ="1,2,3,4,5";

      params.sourceType=0;

      params.priceType=0;

      params.categoryIds = i-2;

      params.pageIndex = 1;

      params.pageSize = 20;

      var lvBean = lvUtil.initLv(that,API.Lesson.SEARCH,params,i,'',{

        getListFromNetData:function(netData){

          return netData;

        },

        handleItemInfo:function(item){

          // utils.showVoiceItemPriceText(item);

        }

      });

      return lvBean;

    });

```