uniapp 微信小程序、支付宝小程序 转发给好友、分享到朋友圈
2022-05-17 本文已影响0人
轩轩小王子
那些你应该知道的事
支付宝小程序 默认每个页面都有分享
微信小程序默认是没有分享的
支付宝小程序 设置imageUrl 无效
分享到朋友圈功能目前只支持安卓,还是beta版 ,并不会真正打开小程序,而是进入一个“小程序单页模式”的页面
页面无登录态,与登录相关的接口,如 wx.login 均不可用;我在项目中就是针对从朋友圈进来的对页面展示做了特殊处理
该封装的优点:
1. 微信小程序 转发给好友、分享到朋友圈 每个页面都要写一次,所以封装成一个minxins 这样需要分享的页面引用一下即可,减少代码冗余
2. 分享内容需要自定义设置哪个,就在用到分享的页面自定义哪个 否则就用默认的
export const shareMixins = {
data() {
return {
// 转发给好友
shareAppMsg: {
title: 'xxx', // 分享标题
path: '/pages/xxx', // 页面 path,必须是以 / 开头的完整路径
imageUrl: `xxx`, // 分享图标
content: '', // 支付宝小程序表现为:吱口令文案
desc: '' // 支付宝小程序表现为:自定义分享描述
},
// 转发给好友 项目中默认设置的,跟小程序的默认分享可能不同
defaultShareAppMsg: {
title: 'xxx',
path: '/pages/xxx',
imageUrl: `xxx`, // 分享图标
content: '',
desc: ''
},
// 分享到朋友圈
shareTimeline: {
title: 'xxx', // 分享标题
imageUrl: `xxx`, // 分享图标
query: 'fromShare=1' // 微信小程序 分享到朋友圈需要这样传参,不是对象 当然你也可以自定义参数
},
// 分享到朋友圈 项目中默认设置的,跟小程序的默认分享可能不同
defaultShareTimeline: {
title: 'xxx',
query: 'fromShare=1'
imageUrl: `xxx`
}
}
},
onLoad() {
uni.showShareMenu({
// 小程序的原生菜单中显示分享按钮,才能够让发送给朋友与分享到朋友圈两个按钮可以点击
menus:["shareAppMessage","shareTimeline"] // 不设置默认发送给朋友
})
},
// 转发给好友
onShareAppMessage () {
// || 短路操作 前一个如果为true, 后面就不执行
return {
title: this.shareAppMsg.title || this.defaultShareAppMsg.title,
path: `${this.shareAppMsg.path}` || `${this.defaultShareAppMsg.path}`,
imageUrl: this.shareAppMsg.imageUrl || this.defaultShareAppMsg.imageUrl,
content: this.shareAppMsg.content || this.defaultShareAppMsg.content,
desc: this.shareAppMsg.desc || this.defaultShareAppMsg.desc
}
},
//分享到朋友圈
onShareTimeline() {
return {
title: this.shareTimeline.title || this.defaultShareTimeline.title,
query: this.shareTimeline.query || this.defaultShareTimeline.query,
imageUrl: this.shareTimeline.imageUrl || this.defaultShareTimeline.imageUrl
}
}
}