当前位置：首页 > news >正文

uniapp小程序全局配置分享到朋友和朋友圈功能的实现

news 2025/7/19 0:38:05

文章目录

- 1.创建/mixins/share.js插件
- 2.全局配置
- 3.编写share.js
- 4.调用
- 5.分享成功

1.创建/mixins/share.js插件

直接创建

2.全局配置

（1）找到main.js在下面引入share.js文件
（2）使用mixins混入vue中，这样就相当于在每一个vue页面中都可以使用分享功能

// 全局引用分享功能
import share from '@/mixins/share.js'
Vue.mixin(share)

3.编写share.js

import {host,baseUrl
} from "../config/config"
export default {// 生成分享记录// 分享给好友onShareAppMessage(res) {let shareData = thisconsole.log(shareData, '分享给好友');let userInfo = uni.getStorageSync('userInfo')if (res.from === 'button') { // 来自页面内分享按钮let shareRecordData = {share_art_name: shareData.art,share_art_id: shareData.id,share_user: userInfo.nickname,share_user_id: userInfo.id}// uni.request({// 	url:host+'/wx/share_record',// 	method:'POST',// 	data:shareRecordData,// 	success:(res)=>{// 		console.log('分享成功',res,res.data.shareListId);// 	}// })return {title: shareData.art,path: `/sub_intake/artDetail/artDetail?id=${shareData.id}&&shareUserId=${userInfo.id}`,mpId: 'wxace5c31fa7433184',// success:(sres)=>{//为了防止诱导分享，腾讯所有的分享都不提供分享成功回调// 	console.log('转发成功');// }}} else { // 来自首页分享按钮return {title: '源码网',path: `/pages/hote_case/hote_case?shareUserId=${userInfo.id}`,mpId: 'wxace5c31fa7433184',imageUrl: baseUrl + '2024-08-05971f15e2.png'// 为了防止诱导分享，腾讯所有的分享都不提供分享成功回调// success:(sres)=>{// 	console.log('转发成功');// }}}},// 分享到朋友圈onShareTimeline(res) {let shareData = thislet userInfo = uni.getStorageSync('userInfo')console.log('分享朋友圈', userInfo);return {title: '我正在使用张三丰源码网，快来使用吧！', //分享的标题query: '/pages/hote_case/hote_case?shareUserId=${userInfo.id}', //点击分享链接之后进入的页面路径imageUrl: baseUrl + '2024-08-05971f15e2.png' //分享发送的链接图片地址}}
}