微信小程序滑动 点击选项卡

《wxml 代码》


积分明细
积分规则
积分兑换




积分明细




积分兑换




积分兑换


wxss 代码

.topSwiper{margin:10rpx;border-radius:12rpx;zoom: 1;color: gray;}
.topSwiper .tab{display:inline-block; width: 33.3333%;text-align: center;height:80rpx;line-height:80rpx;font-size:28rpx;}
.swiper{width: 100%;}
.swiper .swiper_con{font-size: 28rpx;width:auto;height:100%;margin:10rpx; }
.active{border-bottom: 1px solid #000; color: #000;}

js 代码

data: {
nav:0,
},
//获取当前滑块的index
boy: function (e) {
const that = this;
that.setData({
nav: e.detail.current
})
},
//点击切换,滑块index赋值
box: function (e) {
console.log(e)
const that = this;
if (that.data.nav === e.target.dataset.current) {
return false;
} else {
that.setData({
nav: e.target.dataset.current
})
}
},

你可能感兴趣的:(微信小程序滑动 点击选项卡)