微信小程序：新組件web-view詳解（2017.11.02新增）
發(fā)布時(shí)間：2018-04-25 10:48 所屬欄目：小程序開發(fā)教程
一開始聽到微信小程序除組件的時(shí)候，都以為可以跳轉(zhuǎn)任何網(wǎng)頁，但其實(shí)還是有很多限制的，在別人提出在小程序中跳轉(zhuǎn)網(wǎng)頁的需求時(shí)，需要特別注意下面幾點(diǎn)： ...
|
<web-view />
使用前需要注意的點(diǎn)一開始聽到微信小程序除<web-view />組件的時(shí)候，都以為可以跳轉(zhuǎn)任何網(wǎng)頁，但其實(shí)還是有很多限制的，在別人提出在小程序中跳轉(zhuǎn)網(wǎng)頁的需求時(shí)，需要特別注意下面幾點(diǎn)：
配置業(yè)務(wù)域名
使用使用是很簡單的，但是有時(shí)候開發(fā)工具里顯示不出來，可以試試真機(jī)測試。 <!-- wxml --> <!-- 指向微信公眾平臺首頁的web-view --> <web-view src="https://mp.weixin.qq.com/"></web-view> 這樣就行了，不用做其他事情。 頁面跳轉(zhuǎn)例如網(wǎng)頁里一個(gè)按鈕點(diǎn)擊后跳轉(zhuǎn)到微信小程序 /pages/test/test 頁面：
<!-- html -->
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, height=device-height, user-scalable=no, initial-scale=1, minimum-scale=1, maximum-scale=1" />
<style>
.my_div {
margin:0 auto;
width:200px;
height:200px;
background:#aaa;
}
</style>
</head>
<body>
<div class="my_div" onclick="goto()"></div>
</body>
</html>
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.0.js"></script>
<script type="text/javascript">
function goto(){
wx.miniProgram.navigateTo({url: '/pages/test/test'})
}
</script>
這個(gè)是我用vue和相關(guān)框架弄的一個(gè)簡單頁面，表現(xiàn)還是不錯(cuò)的：
相關(guān)接口
支持
參考官方論壇 |
易優(yōu)小程序（企業(yè)版）+靈活api+前后代碼開源
碼云倉庫:
本文地址：http://m.chqfk.com/wxmini/doc/course/24045.html 復(fù)制鏈接
如需定制請聯(lián)系易優(yōu)客服咨詢： 點(diǎn)擊咨詢
