注冊

web-view簡單的配置流程,web-view組件用來承載網頁的容器

2020-09-27
導讀:前言: 小程序一步步的更新迭代,雖然踩坑不斷,但是總體來說是越來越強大了,今天我們就來說一下小程序的web-view組件,相信很多有公司業(yè)務的朋友已經踩過坑了,但是由于web-vi...

前言:

小程序一步步的更新迭代,雖然踩坑不斷,但是總體來說是越來越強大了,今天我們就來說一下小程序的web-view組件,相信很多有公司業(yè)務的朋友已經踩過坑了,但是由于web-view對個人類型的不支持,所以也有很多朋友沒有辦法上手,不過沒關系,下面我就簡單說一下,web-view究竟要怎么內嵌h5?又該如何配置呢?

 ### 首先簡單介紹一下web-view,看過官方api的朋友可以自動忽略忽略,直接進入---配置步驟---即可

功能介紹

web-view簡單的配置流程,web-view組件用來承載網頁的容器

web-view 組件是一個可以用來承載網頁的容器,會自動鋪滿整個小程序頁面。
類似于Frame、Iframe、Frameset標記,只是對于目前來說,web-view還缺乏靈活性,不過相信很多人已經很滿足了(如果非要吐槽,我只想說,web-view生不逢我的時啊...不提了,一把辛酸淚)

使用及后期配置限制問題

  1. 個人類型與海外類型的小程序暫不支持使用。
  2. js-sdk接口限制(具體請參考 官方api )。
  3. 每個頁面只能有一個< web-view />。
  4. 最多可以添加20個業(yè)務域名。
  5. 一年只可修改50次業(yè)務域名。

web-view

 

示例代碼

 <!-- 結構層 -->
 <web-view src="h5地址鏈接"></web-view>

配置步驟

 1. 配置業(yè)務域名
 2. 選擇基礎庫

① --- 配置業(yè)務域名

② --- 選擇基礎庫

這一步是最簡單的,但確實很多朋友最容易忽略的(咳咳...),開發(fā)者工具-->詳情設置-->選擇1.6.4及以上版本即可(目前只支持到1.6.4)。

總結:

以上說的就是web-view簡單的配置流程,大部分的內容小程序的官方api都已經給出,這里只是把配置流程的步驟再進一步的詳細化,變得更通俗一點,但是如果你需要在h5頁面中做某些操作....
那就來看一下官方示例:快速通道

 <! -- html -->
 < script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.0.js"></ script>
 // javascript
 wx.miniProgram.navigateTo({url: '/path/to/page'}) // 這里封裝一下就可以跳轉了...

(注:若遇到調試工具正常起跑web-view,手機微信打不開的情況,不要捉急,升級一下微信版本即可,實際項目中要做一下低版本的兼容。)

  想了解更多關于微信小程序開發(fā)實例教程內容,可以點擊閱讀微信小程序開發(fā)教程

重磅推薦:小程序開店目錄

第一部分:小商店是什么

第二部分:如何開通一個小商店

第三部分:如何登錄小商店

第四部分:開店任務常見問題

第五部分:小商店可以賣什么

第六部分:HiShop小程序特色功能

第七部分:小程序直播

第八部分:小程序收貨/物流

第九部分:小程序怎么結算

第十部分:小程序客服

第十一部分:電商創(chuàng)業(yè)

第十二部分:小程序游戲開發(fā)