小程序web-view引入h5手机站页面的方法

阅读数: 时间:2018-07-31 来源:发菜网站建设制作,专业做网站已十年 标签: 微信小程序

web-view

基础库 1.6.4 开始支持,低版本需做兼容处理

web-view 组件是一个可以用来承载网页的容器,会自动铺满整个小程序页面。个人类型与海外类型的小程序暂不支持使用。

属性名 类型 说明
src String webview 指向网页的链接。可打开关联的公众号的文章,其它网页需登录小程序管理后台配置业务域名。
bindmessage EventHandler 网页向小程序 postMessage 时,会在特定时机(小程序后退、组件销毁、分享)触发并收到消息。e.detail = { data }

示例代码:

<!-- wxml -->
<!-- 指向微信公众平台首页的web-view -->
<web-view src="https://mp.weixin.qq.com/"></web-view>
Bug & Tip
  1. 网页内iframe的域名也需要配置到域名白名单。
  2. 开发者工具上,可以在 <web-view/> 组件上通过右键 - 调试,打开 <web-view/> 组件的调试。
  3. 每个页面只能有一个<web-view/><web-view/>会自动铺满整个页面,并覆盖其他组件。
  4. <web-view/>网页与小程序之间不支持除JSSDK提供的接口之外的通信。
  5. 在iOS中,若存在JSSDK接口调用无响应的情况,可在<web-view/>的src后面加个#wechat_redirect解决。

推荐文章/ Related products

最新案例/ LATEST CASES

发菜网络工作室外贸建站专注企业外贸网站设计制作

提供专业的外贸网站设计、小语种站群、Google ADS推广、谷歌SEO优化、AI大数据营销、SNS社媒营销
立即咨询
X微信咨询

截屏,微信识别二维码

微信号:gdfacai

(点击微信号复制,添加好友)

  打开微信

微信号已复制,请打开微信添加咨询详情!
电话咨询
在线客服
微信咨询
关注我们
在线留言
返回顶部
关闭

网站需求

您的公司
您的姓名*
您的手机*
您的需求
感谢您的咨询,我们会尽快给您回复!