小程序可以点击右上角,可以发送给朋友,如下图
从2.11.3开始可以分享到朋友圈了,官方文档如下:
从基础库
2.11.3
开始支持
支持平台:Android
可将小程序页面分享到朋友圈。适用于内容型页面的分享,不适用于有较多交互的页面分享。
好了,这里就来配置一下吧,官方的文档写的非常杂乱,我也是整理了半天,才搞定了。
每个页面都有onShareAppMessage和onShareTimeline两个生命周期函数,分辨代表点击右上角按钮,和点击分享到朋友按钮。在onShareAppMessage里必须生命以下代码,才会点亮分享到朋友圈这个按钮。
/**
* 用户点击右上角分享
*/
onShareAppMessage () {
wx.showShareMenu({
withShareTicket: true,
//shareTimeline代表分享到朋友圈按钮
menus: ['shareAppMessage', 'shareTimeline']
})
//返回你所需要的标题和图片
return {
title: this.data.articleModel.title,
imageUrl: this.data.articleModel.cover
}
},
当你点击分享到朋友圈按钮的时候,就会触发onShareTimeline这个事件,也很简单,代码如下:
//点击分享到朋友圈按钮
onShareTimeline(e){
return {
title: this.data.articleModel.title,
imageUrl: this.data.articleModel.cover
}
}
点击之后就会出现以下内容:
当用户在朋友圈点击之后,会进入一个“单页模式”,官方文档有详细解释,我这里大致说一下,这个单页模式并非直接进入小程序,只有点击底部前往小程序按钮,才会进入真正的小程序,还是一个阉割版的小程序界面,很多函数和功能不能用的。
在单页模式里云函数就不能用,如果要使用云函数就必须另外设置一下,如果你没有使用云函数就忽略下面的操作。
你需要在云开发的权限设置里,先允许未登录用户访问,如下图:
然后在云函数权限里,设置允许所有用户访问。
至此,就可以实现分享自定义发送给朋友和分享到朋友圈的界面啦。