//页面代码
<view class='swiper-list'>
<view class="swiper-list-Son{{currentTab==0?'active':' '}}"data-current="0" bindtap="clickTab">无极剑圣</view>
<view class="swiper-list-Son{{currentTab==0?'active':' '}}"data-current="0" bindtap="clickTab">疾风剑豪</view>
<view class="swiper-list-Son{{currentTab==0?'active':' '}}"data-current="0" bindtap="clickTab">德玛西亚</view>
</view>
<swiper current="{{currentTab}}"duration="300"bindchange="swiperTab">
<swiper-item><view>第一屏</view></swiper-item>
<swiper-item><view>第二屏</view></swiper-item>
<swiper-item><view>第三屏</view></swiper-item>
</swiper>
//js代码
var app=getApp()
Page({
data:{
currentTab:0
},
onLoad:function(options){ // 页面初始化 options为页面跳转所带来的参数 },
//滑动切换 swiperTab:function( e ){
var that=this;
that.setData({
currentTba:e.detail.current
});
},
//点击切换 clickTab: function( e ){
var that = this;
if( this.data.currentTab === e.target.dataset.current ) {
return false;
} else {
that.setData( {
currentTab: e.target.dataset.current
})
}
}
})
//css代码
就不写了 既让都学小程序了 相信大家都已经对css烂熟于心了！！！！
