uniapp分享功能

页面生命周期 https://uniapp.dcloud.net.cn/tutorial/page.html#lifecycle
onShareTimeline 监听用户点击右上角转发到朋友圈 微信小程序 2.8.1+
onAddToFavorites 监听用户点击右上角收藏 微信小程序、QQ小程序 2.8.1+
onShareAppMessage 用户点击右上角分享 微信小程序、QQ小程序、支付宝小程序、抖音小程序、飞书小程序、快手小程序、京东小程序

小程序分享（vue2和vue3书写方式不同）

在 Vue 3 的

用户点击分享按钮的时候会调用。这个分享按钮可能是小程序右上角原生菜单自带的分享按钮，也可能是开发者在页面中放置的分享按钮（）；

<script setup>
// 分享微信好友
import { onLoad, onReachBottom,onShareAppMessage,onShareTimeline } from '@dcloudio/uni-app';
...
onShareAppMessage(() => {
return {
title: '会员福利社', // 分享标题
path: '/pages/index/index', // 分享路径
imageUrl:'http://mallzzy.oss-cn-beijing.aliyuncs.com/522454e4c00fa5925d16de531e2caabda220d7a243aefa3be46dc4b7229ba5a3.jpg' // 分享图片路径
};
});

// 分享朋友圈
onShareTimeline(() => {
return {
title: '会员福利社', // 分享标题
path: '/pages/index/index', // 分享路径
imageUrl: 'http://mallzzy.oss-cn-beijing.aliyuncs.com/522454e4c00fa5925d16de531e2caabda220d7a243aefa3be46dc4b7229ba5a3.jpg' // 分享图片路径
};
});
</script>

可配置的分享字段：参考uniapp官网

在 Vue 2 中，onShareAppMessage 和 onShareTimeline 方法应该在组件的 methods 中定义，并且需要在 onLoad 或 onShow 生命周期钩子中调用 this.setShareAppMessage 和 this.setShareTimeline 来注册这些方法

不需要导入onShareAppMessage，setShareTimeline
<script>
onShow() {
 ...其他代码
// 注册分享方法
this.setShareAppMessage();
this.setShareTimeline();
},
methods: {
 ...其他代码
// 分享微信好友
setShareAppMessage() {
uni.showShareMenu({
withShareTicket: true,
menus: ['shareAppMessage', 'shareTimeline']
});
uni.onShareAppMessage(() => {
return {
title: '门店', // 分享标题
path: 'pages/integralIndex/index', // 分享路径

success: function (res) {
console.log('分享成功', res);
}
};
});
},
// 分享朋友圈
setShareTimeline() {
uni.showShareMenu({
withShareTicket: true,
menus: ['shareAppMessage', 'shareTimeline']
});
uni.onShareTimeline(() => {
return {
title: '门店', // 分享标题
path: 'pages/integralIndex/index', // 分享路径

};
});
}
}
};
</script>

说明：
setShareAppMessage 和 setShareTimeline 方法：

在 methods 中定义了 setShareAppMessage 和 setShareTimeline 方法，用于注册分享功能。
使用 uni.showShareMenu 方法显示分享菜单，并注册 uni.onShareAppMessage 和 uni.onShareTimeline 回调函数。
onShow 生命周期钩子：

在 onShow 钩子中调用 setShareAppMessage 和 setShareTimeline 方法，确保每次页面显示时都注册分享功能。

原文地址：https://blog.csdn.net/kjl536566/article/details/143565322

免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！