swiper是微信小程序自帶的一個(gè)圖片輪播組件，跟我們做網(wǎng)站用的圖片切換插件一樣，用于輪播展示圖片，可以展示應(yīng)用功能、優(yōu)勢(shì)特色、優(yōu)惠推薦、活動(dòng)推薦信息等，一般用于應(yīng)用最顯眼的地方，放置最需要推薦給用戶的內(nèi)容。



先看看這個(gè)插件的屬性介紹，很多用戶發(fā)現(xiàn)一個(gè)問(wèn)題，為什么沒(méi)有單個(gè)點(diǎn)擊事件呢？或者點(diǎn)擊某個(gè)圖片跳轉(zhuǎn)到其他頁(yè)面呢？看下圖。



那么如何實(shí)現(xiàn)點(diǎn)擊不同的切換圖片，實(shí)現(xiàn)調(diào)整不同頁(yè)面呢？

因?yàn)檫@些經(jīng)常需要改變的肯定要做成后臺(tái)修改，由后臺(tái)指定頁(yè)面的跳轉(zhuǎn)地方，因?yàn)樾〕绦蚋W(wǎng)頁(yè)不一樣，沒(méi)有直接顯示頁(yè)面地址，所以管理人員不知道哪個(gè)頁(yè)面是哪個(gè)地址，這時(shí)，開(kāi)發(fā)人員應(yīng)該注意到這個(gè)問(wèn)題，做一些封裝讓管理人員選擇而不是填寫，避免出錯(cuò)，如下圖。





后臺(tái)設(shè)置好后，就可以根據(jù)傳入的URL實(shí)現(xiàn)跳轉(zhuǎn)，現(xiàn)在看看前端怎么實(shí)現(xiàn)。



如上圖，在圖片image里設(shè)置bindtap點(diǎn)擊事件，同事綁定dataset屬性u(píng)rl

然后小程序JS事件判斷進(jìn)行跳轉(zhuǎn)，首先是判斷是不是TAB頁(yè)面，如果是采用switchTab否則用navigateTo.



通過(guò)以上介紹，基本就完成了小程序swiper組件進(jìn)行自定義頁(yè)面跳轉(zhuǎn)的功能實(shí)現(xiàn)。

方維網(wǎng)絡(luò)專注于微信小程序定制開(kāi)發(fā)，如果你有想法，方維網(wǎng)絡(luò)助你實(shí)現(xiàn)把握微信千億流量紅利。