在測(cè)試時(shí)需要給swiper組件添加外部鏈接問(wèn)題。今天我來(lái)說(shuō)一下怎么解決的？
思路：小程序里沒(méi)有辦法直接給swiper組件添加鏈接，點(diǎn)擊時(shí)用api wx.navigateTo實(shí)現(xiàn)的。
微信小程序團(tuán)隊(duì)推出一個(gè)新組件web-view，
可以在這個(gè)組件中打開(kāi)你的html5網(wǎng)頁(yè)，
而且可以在web-view里面打開(kāi)網(wǎng)頁(yè)的a標(biāo)簽，
也就是說(shuō)可以實(shí)現(xiàn)鏈接跳轉(zhuǎn)。
例如：
wxml 內(nèi)容

<swiper indicator-dots="true" autoplay="true" interval="{{interval}}" duration="{{duration}}" circular="true"><block wx:for="{{imgUrls}}" wx:key="{{index}}" ><swiper-item><image src="{{item}}" class="slide-image" width="100%" bindtap='loadFuction' id='{{index}}' /></swiper-item></block> </swiper>

index.js內(nèi)容

loadFuction(e) {console.log(e);let num=e.currentTarget.id;if (num==0){wx.navigateTo({url: '/page/component/out/out', //路徑必須跟app.json一致success: function () {}, //成功后的回調(diào)；fail: function () { }, //失敗后的回調(diào)；complete: function () { } })}},

注意：需要配置app.json，不然會(huì)報(bào)錯(cuò)。

out.wxml內(nèi)容

<web-view src="https://wap.ysjhacc.com/"></web-view> //任何鏈接都可以

編譯之后會(huì)報(bào)一下錯(cuò)誤：

報(bào)錯(cuò)原因：使用<web-view>這個(gè)標(biāo)簽需要在小程序管理后臺(tái)設(shè)置業(yè)務(wù)域名，登錄后臺(tái)后找到設(shè)置-開(kāi)發(fā)設(shè)置-業(yè)務(wù)域名，然后把你需要加載的域名添加進(jìn)去

只要把這個(gè)勾上了顯示就正常了。
看一下效果：
項(xiàng)目的第一個(gè)swiper組件如圖：

點(diǎn)擊之后：

大家可以動(dòng)手試試，希望對(duì)你們有所幫助。

參考文獻(xiàn)：
https://blog.csdn.net/towtotow/article/details/78621845
https://blog.csdn.net/qq_32113629/article/details/79483213
http://www.cnblogs.com/gxsyj/p/9280816.html

總結(jié)

以上是生活随笔為你收集整理的微信小程序web-view组件 打开外部url的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。