开发者工具：1.05.2102010稳定版，环境：Windows，框架：小程序

这是页面结构:

<Tabs tabs="{{tabs}}" bindtabsItemChange="handletabsItemChange"></Tabs> 


<view clas="rank">


     <block wx:if="{{tabs[0].isActive}}">


         <view class="my_rank">我的排名：{{my_rank}}</view>
         <view class="dis_rank" wx:for="{{dis_rank}}" wx:key="*this">
             <text>{{index+1}}</text>
             <image  src="{{item.image}}" mode="widthFix"/>
             <text>{{item.Name}}</text>
             <text>{{item.totalDistance}}里</text>
             <text>{{item.department}}</text>
         </view>    


     </block>


     <block wx:elif="{{tabs[1].isActive}}">
         <view class="my_rank">我的排名：{{my_rank}}</view>
         <view class="dis_rank" wx:for="{{dis_rank}}" wx:key="*this">
             <text>{{index+1}}</text>
             <image  src="{{item.image}}" mode="widthFix"/>
             <text>{{item.Name}}</text>
             <text>{{item.totalDistance}}</text>
             <text>{{item.department}}</text>
         </view>            
     </block>
     
</view>

这是样式，因为写着写着发现一点效果也没有，就随便写了一下

/* pages/rank/index.wxss */
//page这部分的样式是有的
page {
  width: 100%;
  height: 100%;
  padding: 10px;
  background-color: #eee;
}
//但是这下面的样式就没用了
.rank {
  background-color: #fff;
}
.rank .my_rank {
  margin: 20px auto;
}
.rank .dis_rank {
  height: 60px;
  display: flex;
}
.rank .dis_rank image {
    flex:1;
}
.rank .dis_rank text {
    flex:1;
}