uniapp 实现当前页面分享至微信好友或朋友圈功能(带参数和无参数)

这篇具有很好参考价值的文章主要介绍了uniapp 实现当前页面分享至微信好友或朋友圈功能(带参数和无参数)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

大家好!匆匆忙忙又到了周三,今天是2023年9月13日|农历七月二十九,今天这篇文章主要是微信小程序实现分享当前页面到朋友圈或微信好友,下面来看下具体实现方式吧!

uniapp 实现分享至微信好友或朋友圈功能

带参数和无参数是根据自己的业务需求,如果需要再onLoad函数里面赋值一些属性值的时候可以在path中携带参数,当用户通过我们分享的链接进来后,就会携带参数。

无参数跳转

// 分享微信好友
onShareAppMessage() {
  return {
    title: '标题', //分享标题 这个可以根据业务需求去定义
    path: '当前需要进行分享页面的地址' //例如:path: 'page/home/index'
  }
},
// 分享朋友圈
onShareTimeline() {
  return {
    title: '标题', //分享标题 这个可以根据业务需求去定义
    path: '当前需要进行分享页面的地址' //例如:path: 'page/home/index'
  }
},

带参数跳转

我业务需求是分享出去的path中要携带参数id,在用户通过我分享的链接进入到这个页面时,需要触发onLoad函数,通过我携带的id参数去请求后端接口,渲染页面数据。
具体代码如下:

// 分享微信好友
onShareAppMessage() {
  return {
    title: '标题',
    path: '/page/home/index?id='+this.id
  }
},
// 分享朋友圈
onShareTimeline() {
  return {
    title: '标题',
    path: '/page/home/index?id='+this.id
  }
},

下面是对onLoad函数的代码:
这块我就需要再分享的时候传递一个id属性,在页面渲染时触发onLoad函数,把id属性传递给getQuery函数,请求后端,实现数据动态渲染。

onLoad(e) {
 console.log("e============>",e)
 if (e.hasOwnProperty('id')) {
   this.id = e.id
 }
 this.getQuery(this.id)
},

结束语

这就是我遇到的问题及解决方案,希望本篇博文可以解决你遇到的问题,如果有不明白的博主,或者你也遇到了类似的问题,私信我,我会一一为你进行解答,不收取任何费用,欢迎打扰哦~文章来源地址https://www.toymoban.com/news/detail-708960.html

到了这里,关于uniapp 实现当前页面分享至微信好友或朋友圈功能(带参数和无参数)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • onShareAppMessage 使用uniapp小程序分享好友,朋友圈功能

    1、分享到好友,可以使用button,绑定open-type=\\\"share\\\" 就可以调onShareAppMessage方法 注意: onShareAppMessage和methods、onLoad等同级 这个项目要求就是传当前页面过去,用户好友再页面也可以进行操作,不需要登陆账号,所以传了用户id过去,可以调取相同后台数据 2、分享到朋友圈

    2024年02月13日
    浏览(44)
  • 不同平台使用不同技术实现微信好友、朋友圈分享汇总(H5、taro、uni-app)

    人生路漫漫,坑,是活久了见。程序猿世界里各种奇葩的需求都有,随之而来的各种坑也是层出不穷。 应前IBM同事邀请特来做分享的专题总结。一般人我不告诉他,刷到的朋友们就赚到了,你懂的~~~~~~收藏吧!   事情前情概述,昨天IBM的同事前来咨询我怎样实现微信分享功

    2024年02月15日
    浏览(75)
  • 微信小程序开启分享给好友及分享朋友圈功能

    创建一个空白模板的微信小程序,发布成功后才发现不能分享给好友 及朋友圈 查了下才知道,要有分享功能需要开启。 在小程序首页的里添加以下两个函数  分享好友 和朋友圈里设置要显示 的标题的图片底图。  return {       title:\\\'分享时标题\\\',       query:{        

    2024年02月12日
    浏览(63)
  • 微信小程序 - - - - - 转发分享(发送给好友、分享到朋友圈)

    监听用户点击右上角菜单的「转发」按钮时触发的事件 设置转发的参数 官方文档:onShareAppMessage ****.js 分享到朋友圈 不支持自定义页面路径!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! 监听用户点击右上角菜单的「转发」按钮时触发的事件 设置转发

    2024年02月09日
    浏览(70)
  • uniapp实现小程序页面转发和分享到朋友圈

    1、借助uniapp中页面生命周期钩子onShareAppMessage(OBJECT)用户点击右上角分享 在 js 中定义 onShareAppMessage 处理函数(和 onLoad 等生命周期函数同级),设置该页面的分享信息。 2、借助uniapp中页面生命周期钩子onShareTimeline监听用户点击右上角转发到朋友圈 在 js 中定义 onShareTimeline

    2024年02月15日
    浏览(35)
  • 微信小程序嵌套的H5使用小程序分享(分享微信好友或朋友圈)

    嵌套在微信小程序中的H5想要使用小程序自带分享功能,分享H5的页面给微信好友或朋友圈 H5中可使用wx.miniProgram.postMessage向小程序的webview发送消息,会触发组件的message事件,在小程序webview页面onShareAppMessage,onShareTimeline中进行使用。

    2024年02月13日
    浏览(63)
  • uniapp 微信小程序实现小程序分享好友

    我们可以使用 onShareAppMessage 的方法对 button 按钮进行触发 HTML代码

    2024年02月02日
    浏览(71)
  • 微信小程序(uniapp)-实现分享图片给微信好友

    官方地址: 微信开放文档 | wx.showShareImageMenu(Object object) 示例代码:

    2024年02月11日
    浏览(75)
  • uni-app 微信小程序全局配置分享好友、朋友圈...

    使用uni-app在实际项目中开发微信小程序,经常会遇到给项目添加分享给微信好友、朋友圈...功能,一般来说要将某个页面分享出去,就要在当前页面添加:  且onShareAppMessage()与onShareTimeline() 与methods同级!!! 官方网址:uniapp.dcloud.io/api/plugins… 这样做虽然实现了分享功能,

    2024年02月11日
    浏览(73)
  • uniapp实现微信小程序全局【发送给朋友】、【分享到朋友圈】、【复制链接】

    一、在开发微信小程序的时候,发现【发送给朋友】、【分享到朋友圈】、【复制链接】功能,灰色不可用。 很常见的功能,但是这几个功能,并不是你项目建起来了就有的。 1.【发送给朋友】使用 onShareAppMessage 这个方法 如果你的小程序,发现他的【转发给朋友】的按钮时

    2024年02月12日
    浏览(50)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包