1、在要分享的按钮上写一个跳转

<navigator url="../invite1/invite1">
  <button class="invite_btn">立即邀请</button>
</navigator>
2、再新建一个页面invite1,新建一个web-view

wxml页面

<web-view src="{{shareUrl}}"></web-view>
js页面

定义一个变量,并对其赋值。

data:{
  shareUrl: null
},
onLoad: function (options) {
  var that = this
  that.setData({
    shareUrl: "http://test.meetfit.com.cn/share/active/?userId=" + id + "&userName=" + nickname
  })
},

  

3、分享js
onShareAppMessage: function (res) {
  var that = this
  if (res.from === 'button') {
    // 来自页面内转发按钮
    console.log(res.target)
  }
  return {
    title: '分享H5',
//这一点很重要哦,小程序只能打开自己的页面,所以需要本地的地址+webViewUrl的地址才行。
    path: "/pages/mine/invite1/invite1?url=" +res.webViewUrl,
    imageUrl: "",
    success: (res) => {
      if (res.data.code == 0) {
        wx.showToast({
        title: '发送邀请好友成功',
        icon: 'success',
        duration: 2000
      })
    } else {
     wx.showToast({
      title: res.data.message,
      icon: 'none',
      duration: 2000
    })
   }
  },
    fail: (res) => {
    console.log("转发失败", res);
    }
  }
}

  

小程序分享H5页面的更多相关文章

  1. 微信小程序跳H5页面

    主页面:index.wxml 主页面:index.js ↑跳转到另一个wxml页面→recharge.wxml recharge.wxml web-view中设置跳转h5的链接,可以加上需要的参数: ...

  2. 小程序和H5互调

    小程序跳H5页面 https://blog.csdn.net/mytljp/article/details/81030687(copy) H5页面跳小程序 https://blog.csdn.net/ ...

  3. Taro 多端开发的正确姿势:打造三端统一的网易严选(小程序、H5、React Native)

    笔者所在的趣店 FED 早在去年 10 月份就已全面使用 Taro 框架开发小程序(当时版本为 1.1.0-beta.4),至今也上线了 2 个微信小程序.2 个支付宝小程序. 之所以选用 Taro, ...

  4. 微信小程序分享至朋友圈的方法

    最近研究怎么实现微信小程序分享至朋友圈,对就是朋友圈. 微信小程序目前没有直接提供方法来将小程序分享至朋友圈,不过可以采用曲线救国的方式来达到目的. 方法分两步: 1.通过浏览器将希望分享的东西风向至 ...

  5. 小程序嵌套H5的方式和技巧(一)

    文章内多次使用了关键字"壳",首先先解释一下什么是壳 壳: 小程序由原生的web-view组件形成的页面,页面只包含技术逻辑(如打开H5页面),不包含具体业务接口请求和业务逻辑处理 ...

  6. 微信小程序分享及信息追踪

    我就是个搬用工—来源:https://www.jianshu.com/p/87a75ec2fd53 小程序分享群及信息追踪 需求 页面分享 ​ 小程序页面分享链接增加source参数,值为用户ID加密 ...

  7. 微信小程序分享支持自定义封面图

    微信小程序又发布更新了,刚好昨天支付宝也发布小程序,不能让它抢了风头的节奏.微信小程序主要更新如下:“小程序分享支持自定义封面图,公众号及小程序客服可发送小程序卡片.同时,我们还开放了获取发票抬头,指 ...

  8. 微信小程序--分享报错(thirdScriptError Cannot read property 'from' of undefined;at pages/index/index page onShareAppMessage function TypeError: Cannot read property 'from' of undefined)

    分享功能: onShareAppMessage: function (res) { if (res.from === 'button') { // 来自页面内转发按钮 console.log(res. ...

  9. 微信小程序详解——页面之间的跳转方式【路由】和参数传递

    微信小程序拥有web网页和Application共同的特征,我们的页面都不是孤立存在的,而是通过和其他页面进行交互,来共同完成系统的功能.今天我们来研究小程序页面之间的跳转方式. 1.先导 在Andr ...

随机推荐

  1. 【攻防世界】 高手进阶区 Recho WP

    0x00 考察点 考察点有三个: ROP链构造 Got表劫持 pwntools的shutdown功能 0x01 程序分析 上来三板斧 file一下 checksec --file XXX chmod ...

  2. 十二、js去掉空格_比较字符长度_中英文判断_页面初始化_简体字与繁字体判断

    1.去掉字符串前后所有空格 function trimBlank(str){ return str.replace(/(^\s*)|(\s*$)/g, ""); } 2.字符串长度 ...

  3. redis中关闭rdb跟aof

    https://zm10.sm-tc.cn/?src=l4uLj8XQ0IiIiNGdip2KlJDRnJCS0JaRmZCbmouelpPSzc%2FJz8vJxtGXi5KT&uid=49 ...

  4. 搭建solr集群的时候出现 ./zkcli.sh:行13: unzip: 未找到命令

    主要的原因是: linux系统下面没有安装压缩解压工具    zip 和 unzip:需要我们自己手动的安装: 利用yum命令安装即可: yum install -y unzip zip

  5. 关于MySQL连接Navicat Premium 12失败的解决方法

    出现问题的原因:MySQL8.0之后更换了加密方式,而这种加密方式客户端不支持 解决:更改加密方式 ALTER USER 'root'@'localhost' IDENTIFIED WITH mysq ...

  6. 前端学习笔记系列一:15vscode汉化、快速复制行、网页背景图有效设置、 dl~dt~dd标签使用

    ctrl+shift+p,调出configure display language,选择en或zh,若没有则选择安装使用其它语言,则直接呼出扩展程序搜索界面,选择,然后安装,重启即可. shift+a ...

  7. Android按返回键退出程序

    既然想实现 按两次返回键 退出程序 有两个关键词 一个是 “返回键”,再一个是“退出程序” )先说“退出” 退出相信大家都会 finish(); System.exit(); 为了确保不出现问题,两种 ...

  8. MapReduce会自动忽略文件夹下的.开头的文件

    MapReduce会自动忽略文件夹下的.开头的文件,跳过这些文件的处理.

  9. php二位数组排序(按子元素排序)

    array_multisort(array_column($mainTree[$note]["beCalls"], "wtp"), SORT_DESC, arr ...

  10. 循环的N种写法

    protype,json都算进去 先总结一下 伪数组的循环方式有,for,for-of 数组的循环方式有for,forEach,map,filter,find,some,every,reduce,fo ...