湖南做网站 就问磐石网络专业/人民网疫情最新消息
承载网页的容器。会自动铺满整个小程序页面,个人类型的小程序暂不支持使用。
客户端 6.7.2 版本开始,navigationStyle: custom 对 web-view 组件无效
属性 | 说明 |
---|---|
src | webview 指向网页的链接。可打开关联的公众号的文章,其它网页需登录小程序管理后台配置业务域名。 |
bindmessage | 网页向小程序 postMessage 时,会在特定时机(小程序后退、组件销毁、分享)触发并收到消息。e.detail = { data },data是多次 postMessage 的参数组成的数组 |
bindload | 网页加载成功时候触发此事件。e.detail = { src } |
binderror | 网页加载失败的时候触发此事件。e.detail = { src } |
web-view是指网页的容器,对于src网页可以是关联的微信小程序的公众号 也可以是配有业务域名的h5网页,bindload是表示加载成功的后得回调,binderror是加载失败的回调,可以在此做页面优化处理,bindmessage是做h5页面和小程序传参作用
注意:src传参到网页路径的参数需要 :encodeURIComponent()转义一下
1.关闭当前web-view 回到之前的页面
wx.miniProgram.navigateBack();
2.跳转到对应的 微信小程序页面
wx.navigateTo({url: '/pages/webview/webview?url=' + encodeURIComponent('/message?id=' + id),})
3.web-view 页面自己跳转 对应的框架 对应方式
this.$router.push()
window.location.herf=
window.open()
4.web-view 调试
1.微信自带页面调试
2.参考:https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html
安卓的网页apk 手机打开调试模式 抓取网页
安卓web-view 调试 chrome://inspect/#devices
3.弹窗的模式,更接近真实系统
参考资料:https://developers.weixin.qq.com/community/develop/article/doc/000884cf8a80301d298a2709056013