请选择 进入手机版 | 继续访问电脑版
查看: 58|回复: 0

微信小程序分享给朋友和分享到朋友圈怎么实现?

[复制链接]

823

主题

830

帖子

4305

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
4305
发表于 2022-6-21 17:05:19 | 显示全部楼层 |阅读模式
微信小程序分享给朋友和分享到朋友圈怎么实现?
微信小程序分享给朋友和分享到朋友圈,都需要在小程序编写代码实现。

目录
1、官方文档
2、分享给朋友,即转发
3、分享到朋友圈
4、常见问题
4.1、分享朋友圈灰色
4.2、如何测试分享给朋友
4.3、如何测试分享给朋友圈

1、官方文档
转发官方文档:转发=>微信开放文档
分享到朋友圈官网文档:分享到朋友圈=>微信开放文档

官方文档,很重要,一定要看完。细节和坑在文档中都有说明。

2、分享给朋友,即转发
通过onShareAppMessage实现分享,分享有2种方式:
方法1:通过小程序右上角...进行分享
方法2:在页面,新增“分享”按钮,进行分享

通过给 button 组件设置属性 open-type="share",可以在用户点击按钮后触发 Page.onShareAppMessage 事件,相关组件:button。

前端按钮代码举例:
  1. <button class="bottom-share" data-id='122' open-type="share" type="primary">分享</button>
复制代码

js中的代码举例:
  1.   onShareAppMessage: function (res) {// 分享
  2.     if (res.from === 'button') {
  3.       // 来自页面内转发按钮
  4.       //console.log("转发:" + JSON.stringify(res.target))
  5.     }
  6.     return {
  7.       title: this.data.goodsInfo.goodsName,
  8.       path: '/pages/order/detail/detail?goodsId=' + this.data.goodsInfo.id ,
  9.       success: function (res) {
  10.         //console.log('/pages/order/detail/detail?goodsId=' + this.data.goodsInfo.id )
  11.         // 转发成功
  12.         //console.log("转发成功:" + JSON.stringify(res));
  13.       },
  14.       fail: function (res) {
  15.         // 转发失败
  16.         //console.log("转发失败:" + JSON.stringify(res));
  17.       }
  18.     }
  19.   },
复制代码

3、分享到朋友圈
分享朋友圈的代码举例:
  1.    /*分享朋友圈 */
  2.    onShareTimeline: function() {
  3.     return {
  4.       title: '***批发商城',
  5.       query: 'goodsId=' +this.data.goodsInfo.id,
  6.       imageUrl: this.data.goodsInfo.mainImg,
  7.     }
  8.   },
复制代码

4、常见问题
4.1、分享朋友圈灰色
原因:没有编写分享朋友圈代码

解决方法:见第3节,编写分享朋友圈代码

4.2、如何测试分享给朋友
在开发环境,通过预览进行测试,分享给朋友或者文件传输助手。

4.3、如何测试分享给朋友圈
在开发环境,通过预览进行测试,由于是测试,分享朋友圈时,可见范围选择私有,只有自己看到。

没有解决的朋友,欢迎留言,我会第一时间回复。

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|小黑屋|蓄财网 ( 豫ICP备2021002293号 )

GMT+8, 2022-7-3 01:01 , Processed in 0.109471 second(s), 28 queries .

蓄财网 ©版权所有

© 2022 蓄财网(www.aixc.cn)

快速回复 返回顶部 返回列表