logo头像

技术是一种信念

小程序分享转发实现

小程序分享或转发有两种方式,一种是通过在页面中自定义按钮的形式,另外一种只需要在js中定义 onShareAppMessage 函数,页面右上角就会出现转发的按钮。详细文档请参阅微信官方文档微信转发API

分享方式

1
2
3
4
5
6
7
8
9
10
11
12
13
Page({
onShareAppMessage: function (res) {
//menu 是来自右上角的转发,button是页面内的转发按钮。
if (res.from === 'button') {
// 来自页面内转发按钮
console.log(res.target)
}
return {
title: '自定义转发标题', //如不不写默认为小程序的名称
path: '/page/index'
}
}
})
  • 页面内按钮
  • 首先在页面内定义一个按钮,设置open-type为share
    1
    2
    >  <button open-type="share">转发</button>
    >
  • 然后点击按钮的时候会自动调用页面中定义好的onShareAppMessage方法。

分享内容

在分享内容的时候,我们通常会指定到小程序中具体的某个页面。但是有时页面不是首页的情况下,可能需要进行参数的传递,那么我们把需要的参数存放在data中即可,然后路径中使用即可。这里需要注意的是this指代的问题。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
/*
* 右上角转发功能
* */
onShareAppMessage: function(res) {
var that = this;
console.log(res);
if (res.from === 'menu') {
// 来自页面内转发按钮
}
return {
title: "“书来书往”读书季享好礼,分享即可领红包哦",
path: '/pages/booklists/booklist-detail/booklist-detail?listId=' + that.data.listId,
imageUrl: this.data.coverUrl,
success: function(res) {
// 转发成功
console.log("转发成功")
},
fail: function(res) {
// 转发失败
console.log(res);
}
}
}

参考文章