需求：小程序點擊輪播圖跳轉到tab導航界面，效果如下所示
點擊輪播圖的圖片卢肃，跳轉到我的界面上
先實現(xiàn)以下的代碼疲迂，在以下的基礎上，開始實現(xiàn)需求
微信小程序底部導航欄
http://www.reibang.com/p/89a63dc99839
wxml部分
一切準備好之后莫湘，在wxml文件里面尤蒿，我們要使用 bindtap在圖片上綁定一個事件，在js里面寫事件函數(shù)的具體操作幅垮。
<image src="{{item}}" bindtap='click_swiper' class="slide-image"/>
具體代碼如下：
<swiper indicator-dots="{{indicatorDots}}"
autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}">
<block wx:for="{{imgUrls}}" wx:key="unique">
<swiper-item>
<image src="{{item}}" bindtap='click_swiper' class="slide-image"/>
<!-- 綁定一個事件腰池，在js里面寫事件函數(shù)的具體操作 -->
</swiper-item>
</block>
</swiper>
js部分
寫一個click_swiper函數(shù)，函數(shù)執(zhí)行的是忙芒，當點擊圖片上的事件的時候示弓，觸發(fā)這個函數(shù)，進入函數(shù)之后呵萨，因為是跳轉到tab界面奏属，所以使用switchTab屬性，跳轉的指定路徑甘桑。
click_swiper:function(e){
// 當點擊圖片上的事件的時候拍皮，觸發(fā)這個函數(shù)
wx.switchTab({
// 因為是跳轉到tab界面歹叮，所以使用switchTab屬性
url: '/pages/logs/logs',//跳轉的指定路徑
})
}
具體代碼如下：
Page({
data: {
imgUrls: [
'http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg',
'http://img06.tooopen.com/images/20160818/tooopen_sy_175866434296.jpg',
'http://img06.tooopen.com/images/20160818/tooopen_sy_175833047715.jpg'
],
indicatorDots: true,
autoplay: true,
interval: 3000,
duration: 500,
},
click_swiper:function(e){
// 當點擊圖片上的事件的時候，觸發(fā)這個函數(shù)
wx.switchTab({
// 因為是跳轉到tab界面铆帽，所以使用switchTab屬性
url: '/pages/logs/logs',//跳轉的指定路徑
})
}
})
原文作者：祈澈姑娘
技術博客：http://www.reibang.com/u/05f416aefbe1
90后前端妹子咆耿，愛編程，愛運營爹橱，愛折騰萨螺。
堅持總結工作中遇到的技術問題，堅持記錄工作中所所思所見愧驱，歡迎大家加入群聊慰技，一起探討交流。
