微信小程序选项卡demo

页面

  
    
      {
    {item.name}}
    
  
  过去
  现在
  未来

css样式

.tabbox{
  display: flex;

}
.tabbox_children{
  flex: 1;
  padding: 20rpx;
  text-align: center;
}
.active{
  color: coral;
  border-bottom: 4rpx solid #FF0000 ;
}

js

    clickitem(e) {
      console.log(e);
      let id = e.currentTarget.dataset.id;
      let {list} = this.data;
      list.forEach(item => {
        if(item.id === id){
          item.flag=true;
        }else{
          item.flag=false;
        }
      })
      this.setData({
        list
      })
    }

效果图