uni-app 微信QQ小程序转发分享配置教程

uni-app 微信QQ小程序转发分享配置教程，首先该教程只对应小程序起作用，在开源“星茫多端小程序”的时候写了一个分享主页和文章详情，优化后打算就脱离出来也做一个小教程

平台差异说明

支持：微信小程序，支付宝小程序，百度小程序，头条小程序

不支持:5+app , h5

我们在官网查看onShareAppMessage 得知他有3个参数 一个是title标题，path页面路径，img分享封面图片，官方代码

export default { onShareAppMessage(res) { if (res.from === 'button') {// 来自页面内分享按钮 console.log(res.target) } return { title: '自定义分享标题', path: '/pages/test/test?id=123', imageUrl:'' } } }

我们现在开始修改它

1.发起请求

首先我们发起一个文章详情页请求，随后我们要保存下请求的标题（title），文章id（psouid），文章封面（timg）

onLoad() { uni.request({ url: 'https://www.frbkw.com/wp-json/wp/v2/posts/2026', success:(res) =>{ this.title = res.data.title.rendered; this.timg = res.data.meta.thumbnail; this.psouid = res.data.id; } } }) },

2.保存参数

标题（title），文章id（psouid），文章封面（timg）

data() { return { title:'', timg:'', psouid:'' } },

3.收工

在methods外面写onShareAppMessage，

onShareAppMessage(res) { let that = this; if (res.from === 'button') {// 来自页面内分享按钮 console.log(res.target) } return { title: that.title, path: '/pages/data/data?id=' + that.psouid, imageUrl:that.timg } },

整理来说没有太大的技术含量，只是把保存一个参数，在页面转发分享的时候赋值，效果截图，

若需要相关案例，请关注 微信公众号“枫瑞博客网” 回复 “uni星茫” 下载开源小程序pages/data/data界面