• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

小程序 公众号/h5相互跳转-webview

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

小程序与h5的跳转

前提小程序管理后台配置域名白名单,并且h5页面是嵌在小程序里面(相互跳的前提条件)

在业务域名中设置好访问的h5地址 

 

微信官方web-view 介绍地址 https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html

小程序跳转h5需要用到web-view这个原生组件

pages生成一个webview的目录

 

wxml中

<web-view src="{{url}}"></web-view>

js中接受页面传来的url值

/**
   * 页面的初始数据
   */
  data: {
   url:null,
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.setData({
      url: options.url
    })
  },

  这样就完成了 小程序跳转 h5页面

2019-03-19

 h5跳转小程序

h5跳转小程序 一个是 这个h5必须是 小程序内嵌的h5,同样需要在小程序后台进行业务域名设置

在小程序内能够访问到的h5页面 ,就可以在h5页面上进行小程序的跳转  (h5跳转小程序 需要在小程序的环境中进行跳转 才能 找到目录) 

在h5页面 引入 微信的官方js 

<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>

  

然后 点击的时候 回跳小程序  这里的目录 和 app,json的目录保持一致

  wx.miniProgram.navigateTo({url: \'/pages/card/card\'})

 

就可以实现 h5跳回小程序了  

 


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
微信小程序添加H5外链的小坑们 - Mr_147发布时间:2022-07-18
下一篇:
微信小程序实例源码大全下载发布时间:2022-07-18
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap