web-view簡(jiǎn)單的配置流程,web-view組件用來(lái)承載網(wǎng)頁(yè)的容器
前言:
小程序一步步的更新迭代,雖然踩坑不斷,但是總體來(lái)說(shuō)是越來(lái)越強(qiáng)大了,今天我們就來(lái)說(shuō)一下小程序的web-view組件,相信很多有公司業(yè)務(wù)的朋友已經(jīng)踩過(guò)坑了,但是由于web-view對(duì)個(gè)人類型的不支持,所以也有很多朋友沒(méi)有辦法上手,不過(guò)沒(méi)關(guān)系,下面我就簡(jiǎn)單說(shuō)一下,web-view究竟要怎么內(nèi)嵌h5?又該如何配置呢?
### 首先簡(jiǎn)單介紹一下web-view,看過(guò)官方api的朋友可以自動(dòng)忽略忽略,直接進(jìn)入---配置步驟---即可
功能介紹
web-view 組件是一個(gè)可以用來(lái)承載網(wǎng)頁(yè)的容器,會(huì)自動(dòng)鋪滿整個(gè)小程序頁(yè)面。
類似于Frame、Iframe、Frameset標(biāo)記,只是對(duì)于目前來(lái)說(shuō),web-view還缺乏靈活性,不過(guò)相信很多人已經(jīng)很滿足了(如果非要吐槽,我只想說(shuō),web-view生不逢我的時(shí)啊...不提了,一把辛酸淚)
使用及后期配置限制問(wèn)題
- 個(gè)人類型與海外類型的小程序暫不支持使用。
- js-sdk接口限制(具體請(qǐng)參考 官方api )。
- 每個(gè)頁(yè)面只能有一個(gè)< web-view />。
- 最多可以添加20個(gè)業(yè)務(wù)域名。
- 一年只可修改50次業(yè)務(wù)域名。
web-view
示例代碼
<!-- 結(jié)構(gòu)層 -->
<web-view src="h5地址鏈接"></web-view>
配置步驟
1. 配置業(yè)務(wù)域名
2. 選擇基礎(chǔ)庫(kù)
① --- 配置業(yè)務(wù)域名
② --- 選擇基礎(chǔ)庫(kù)
這一步是最簡(jiǎn)單的,但確實(shí)很多朋友最容易忽略的(咳咳...),開(kāi)發(fā)者工具-->詳情設(shè)置-->選擇1.6.4及以上版本即可(目前只支持到1.6.4)。
總結(jié):
以上說(shuō)的就是web-view簡(jiǎn)單的配置流程,大部分的內(nèi)容小程序的官方api都已經(jīng)給出,這里只是把配置流程的步驟再進(jìn)一步的詳細(xì)化,變得更通俗一點(diǎn),但是如果你需要在h5頁(yè)面中做某些操作....
那就來(lái)看一下官方示例:快速通道
<! -- 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'}) // 這里封裝一下就可以跳轉(zhuǎn)了...
(注:若遇到調(diào)試工具正常起跑web-view,手機(jī)微信打不開(kāi)的情況,不要捉急,升級(jí)一下微信版本即可,實(shí)際項(xiàng)目中要做一下低版本的兼容。)
想了解更多關(guān)于微信小程序開(kāi)發(fā)實(shí)例教程內(nèi)容,可以點(diǎn)擊閱讀微信小程序開(kāi)發(fā)教程。
第二部分:如何開(kāi)通一個(gè)小商店