推荐下载
-
2020-05-12 浏览：740
-
2020-05-06 浏览：521
-
2020-05-08 浏览：510
-
2020-04-04 浏览：504
-
2020-05-12 浏览：502
微信小程序：新组件web-view详解（2017.11.02新增）
发布时间:2020-11-08
一开始听到微信小程序除组件的时候，都以为可以跳转任何网页，但其实还是有很多限制的，在别人提出在小程序中跳转网页的需求时，需要特别注意下面几点： ...
<web-view />
使用前需要注意的点一开始听到微信小程序除<web-view />组件的时候，都以为可以跳转任何网页，但其实还是有很多限制的，在别人提出在小程序中跳转网页的需求时，需要特别注意下面几点：
需要在小程序管理页面 设置-开发设置 里添加要跳转网页的域名为 业务域名 。
跳转域名需要支持 HTTPS 。
添加跳转域名时，需要下载 校验文件 并 放到域名根目录下，并保证可以访问该文件。（所以不要以为想跳什么网站就跳什么网站，这个是需要对应域名服务器做配合的）
业务域名列表
配置业务域名
使用使用是很简单的，但是有时候开发工具里显示不出来，可以试试真机测试。
<!-- wxml --> <!-- 指向微信公众平台首页的web-view --> <web-view src=http://www.yiyongtong.com/archives/"https:/mp.weixin.qq.com/"></web-view>这样就行了，不用做其他事情。
页面跳转例如网页里一个按钮点击后跳转到微信小程序 /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=http://www.yiyongtong.com/archives/"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>这个是我用vue和相关框架弄的一个简单页面，表现还是不错的：
相关接口
基础库 1.6.4 开始支持
参考 官方论坛