小程序中的tab标签

小程序中的tab切换，控制下面的代码块的显示和隐藏

2018-03-22_174856.png

js部分

data: {
    currenttab:'0'
  },
  selectTab:function(e){
    //切换标签页
    console.log(e.currentTarget.dataset.tabid)
    var newtab=e.currentTarget.dataset.tabid;
    if(this.data.currenttab===newtab){
      return
    }else{
      this.setData({
        currenttab:newtab
      })
    }
  }

在data中设定一个currenttab变量，保存当前tab的状态；
再设定标签点击事件 selectTab，更新currenttab的值;
wxml部分

  热门问答
  全部分类




   热门回答部分




  全部分类部分

对于更复杂的tab标签，或者动态获取tab标签的情况，可以使用tabs[]数组保存tab内容，使用index来作为tab的索引值。