//頁面代碼
<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">疾風(fēng)劍豪</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為頁面跳轉(zhuǎn)所帶來的參數(shù)? },
? //滑動(dòng)切換? swiperTab:function( e ){? ?
? ? ? ? var that=this;
? ? that.setData({
? ? ? currentTba:e.detail.current
? ? });
? },
? //點(diǎn)擊切換? 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代碼
就不寫了 ? 既讓都學(xué)小程序了 ?相信大家都已經(jīng)對(duì)css爛熟于心了！?。?！
