欧美三级国产三级日韩三级_亚洲熟妇丰满大屁股熟妇_欧美亚洲成人一区二区三区_国产精品久久久久久模特

微信小程序頁面與web-view頁面之間的跳轉(zhuǎn) - 新聞資訊 - 云南小程序開發(fā)|云南軟件開發(fā)|云南網(wǎng)站建設(shè)-昆明葵宇信息科技有限公司

159-8711-8523

云南網(wǎng)建設(shè)/小程序開發(fā)/軟件開發(fā)

知識(shí)

不管是網(wǎng)站,軟件還是小程序,都要直接或間接能為您產(chǎn)生價(jià)值,我們?cè)谧非笃湟曈X表現(xiàn)的同時(shí),更側(cè)重于功能的便捷,營(yíng)銷的便利,運(yùn)營(yíng)的高效,讓網(wǎng)站成為營(yíng)銷工具,讓軟件能切實(shí)提升企業(yè)內(nèi)部管理水平和效率。優(yōu)秀的程序?yàn)楹笃谏?jí)提供便捷的支持!

您當(dāng)前位置>首頁 » 新聞資訊 » 小程序相關(guān) >

微信小程序頁面與web-view頁面之間的跳轉(zhuǎn)

發(fā)表時(shí)間:2021-1-4

發(fā)布人:葵宇科技

瀏覽次數(shù):119

web-view組件的本質(zhì)是使用浮動(dòng)框架標(biāo)記對(duì) iframe來對(duì)src屬性指定的頁面進(jìn)行加載。本文對(duì)web-view組件使用的一些注意事項(xiàng)進(jìn)行總結(jié)。


一、web-view組件的使用

web-view組件可以使用src屬性來指定要在小程序中顯示的頁面地址,這個(gè)地址必須滿足下列兩個(gè)條件。

  • 必須是https域名地址。
  • 必須是在微信公眾平臺(tái)中配置為白名單的域名。

微信小程序頁面的wxml文件的代碼如下所示。

<web-view src=“https://www….”>web-view>

微信小程序中,一個(gè)頁面只允許使用一個(gè)組件,并且該組件會(huì)鋪滿整個(gè)頁面并覆蓋頁面中的其他組件。

同時(shí)該組件還支持以下事件:

  • bindload:src屬性指定的頁面加載成功時(shí)觸發(fā)該事件。
  • binderror:src屬性指定的頁面加載失敗時(shí)觸發(fā)該事件。

二、web-view頁面跳轉(zhuǎn)回小程序頁面

一般的,web-view組件的src屬性指定的H5頁面之間,可以正常的采用超級(jí)鏈接a標(biāo)記對(duì)進(jìn)行頁面之間的條轉(zhuǎn)。但是web-view頁面要想通過手指觸碰返回小程序頁面,就無法使用超級(jí)鏈接a標(biāo)記了。那么這個(gè)問題應(yīng)該如何解決呢?


1、在H5頁面引入JSSDK

首先需要在H5頁面中引入JSSDK,它可以讓H5頁面的js文件執(zhí)行微信小程序的部分API命令。H5頁面引入JSSDK的代碼如下所示。

<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js">script>
2、為需要跳轉(zhuǎn)至小程序頁面的元素綁定事件

可以通過jQuery或原生js找到需要跳轉(zhuǎn)至小程序頁面的元素,然后為該元素綁定click事件或touchend事件。在事件中可以使用下列API進(jìn)行小程序頁面的條轉(zhuǎn)。

  • wx.miniProgram.navigateTo()
  • wx.miniProgram.navigateBack()
  • wx.miniProgram.switchTab()
  • wx.miniProgram.reLaunch()
  • wx.miniProgram.redirectTo()

上述API的使用與微信小程序中頁面跳轉(zhuǎn)的API使用規(guī)范是一樣的,以wx.miniProgram.navigateTo()為例,該方法的API格式如下所示。

wx.miniProgram.navigateTo({
   url:'../swt/swt',            //指定跳轉(zhuǎn)至小程序頁面的路徑
   success: function(){
	  console.log('success');   //頁面跳轉(zhuǎn)成功的回調(diào)函數(shù)

總結(jié)

本文重點(diǎn)在于對(duì)web-view頁面返回小程序頁面進(jìn)行了講解和總結(jié)。在小程序開發(fā)過程中,web-view頁面的實(shí)現(xiàn)還有許多開發(fā)技巧和功能,主要得力于JSSDK的使用。JSSDK的說明文檔如下所示。

相關(guān)案例查看更多