小程序分享的具体内容可参照官方文档,现在官方的说法为转发。
以下内容只针对转发给朋友这一功能
一、分享方式
1、页面右上角三个...拉起分享
2、按钮主动触发( 必须为button)
二、实现全局配置以及两种分享方式的自定义
小程序分享的实现是通过在page中配置onShareAppMessage实现
三、实现方案:
注意:官方的使用指引中明确了按需出现,所以在app.js全局配置实现所有页面增加分享功能是行不通的。需要每一页单独配置onShareAppMessage。
1、在app.js中写一个公共的shareAppMessage方法。
为了方便各个页面引用,把shareAppMessage方法放在了globalData中,或者写一个js文件,通过在页面中引用文件的方式获取shareAppMessage方法。
#app.js
function shareAppMessage(options) {
// 页面右上角三个...拉起分享的配置
var shareObj = {
title: 分享的title, // 默认是小程序的名称(可以写slogan等)
path: '/pages/index/index', // 默认是当前页面,必须是以‘/’开头的完整路径
imageUrl: 图片地址, //自定义图片路径,可以是本地文件路径、代码包文件路径或者网络图片路径,
//支持PNG及JPG。(但实际我在使用本地图片发现不可用,只能使用线上的图片)。
//不传入 imageUrl 则使用默认截图(当期页面的截图,有可能暴露用户隐私)。
//显示图片长宽比是 5:4。
}
// 页面内的按钮拉起分享的配置(以传入一个自定义的name值为例)
if (options && options.from == 'button') {
//从dataset中获取自定义的值
var eData = options.target.dataset
let departmentName = eData.name || ''
shareObj.title = departmentName + '邀请你'
}
return shareObj
}
App({
globalData: {
// 赋值全局数据
shareAppMessage: shareAppMessage,
},
}
2、引用实现分享
//index.wxml
//按钮分享的方式,可通过dataset传入一些自定义的值
<button open-type="share" data-name="{{name}}" >
分享
</button>
//index.js
//页面...分享方式
var app = getApp()
Page({
onShareAppMessage: app.globalData.shareAppMessage
})
网友评论