1,wxml代码结构
<view class="rech-list">
<view class="{{0 == currentIndex ? 'rech-ac' : 'rech-view'}}" bindtap="titleClick" data-idx="0">
<text class="rech-text1">个人会员</text>
<text class="rech-num">2000积分</text>
<text class="rech-mon">¥200.00</text>
</view>
<view class="{{1 == currentIndex ? 'rech-ac' : 'rech-view'}}" bindtap="titleClick" data-idx="1">
<text class="rech-text1">普通会员</text>
<text class="rech-num">10000积分</text>
<text class="rech-mon">¥1000.00</text>
</view>
<view class="{{2 == currentIndex ? 'rech-ac' : 'rech-view'}}" bindtap="titleClick" data-idx="2">
<text class="rech-text1">高级会员</text>
<text class="rech-num">11000积分*5</text>
<text class="rech-mon">¥5000.00</text>
</view>
<view class="{{3 == currentIndex ? 'rech-ac' : 'rech-view'}}" bindtap="titleClick" data-idx="3">
<text class="rech-text1">VIP</text>
<text class="rech-num">12000积分*5</text>
<text class="rech-mon">¥15000.00</text>
</view>
<view style="clear:both;"></view>
</view>
2,js代码
data: {
//选择默认充值金额的索引值
currentIndex:1,
},
//等级切换选项卡js代码
titleClick: function (e) {
let currentPageIndex =
this.setData({
//拿到当前索引并动态改变
currentIndex: e.currentTarget.dataset.idx
})
},