小程式如何在輪播圖中實現點擊跳轉
輪播圖可以使用swiper元件來實現，點擊跳轉頁面可以使用navigator元件來實現，所以實現點擊輪播圖跳轉頁面的方法是：在swiper元件的swiper-item元件裡嵌套一個navigator即可。
具體實作程式碼如下：
1、WXML程式碼
<!--轮播图 -->
<view class='swiperBanner'>
<swiper indicator-dots='{{indicatorDots}}' autoplay='{{autoplay}}' interval='{{interval}}' duration='{{duration}}' circular='{{circular}}'>
<swiper-item wx:for="{{imgUrls}}" wx:key='{{index}}'>
<navigator url='{{item.link}}'>
<image src="{{item.url}}" class="slide-image" mode="aspectFill"></image>
</navigator>
</swiper-item>
</swiper>
</view>
</view>2、WXSS程式碼
/* 轮播 */
.swiperBanner{
width:100%;
height:420rpx !important;
margin:0 auto;
}
.swiperBanner image{
width:100%;
height:420rpx !important;
}
swiper {
width:100%;
height:420rpx !important;
}3、 JS代碼
indicatorDots:false,
autoplay:true,
interval:3000,
duration: 800,
circular:true,
// 轮播图
imgUrls: [
{
link:'../activity/washCar1/index/index',
url:'https://localhost/static/ttcf/img/banner8.png',
},
{
link: '../activity/Odysseus/index/index',
url: 'https://localhost/static/ttcf/img/banner9.png',
},
],PHP中文網，大量免費小程式開發教程，歡迎學習！
以上是小程式如何在輪播圖中實現點擊跳轉的詳細內容。更多資訊請關注PHP中文網其他相關文章！
