uniapp实现微信小程序全局可分享功能

uniapp实现微信小程序全局【发送给朋友】、【分享到朋友圈】、【复制链接】

主要使用 Vue.js 的 全局混入

1.创建一个全局分享的js文件。示例文件路径为:./utils/shareWx.js ,在该文件中定义全局分享的内容:

javascript 复制代码
export default {
	data() {
		return {}
	},
	//分享小程序
	onShareAppMessage(e) {
		if (e.from === 'button') {
			console.log('来自页面内转发按钮');
		} else if (e.from === 'menu') {
			console.log('右上角菜单转发按钮');
		}
		return {
			// 自定义分享内容
			title: 'xxxx',
			desc: 'xxxxxx',
			path: '/pages/index/index', // 路径,可传递参数到指定页面
			imageUrl: 'https://xxxxxx.com.cn'
		};
	},
	// 分享到朋友圈
	onShareTimeline() {
		return {
			title: 'xxxxx',
			path: '/pages/index/index',
			imageUrl: 'https://xxxxxx.com.cn'
		};
	},
}

2.在项目的 main.js 文件中引入该 shareWx.js 文件, 并使用 Vue.mixin() 方法将之全局混入:

// 导入并挂载全局的分享方法

相关推荐
wuxianda10301 小时前
2026 苹果审核 4.3 (a) 被拒全解析|Guideline 4.3a spam 马甲包拒审原因 + 避坑方案
flutter·uni-app·苹果上架
CSharp精选营4 小时前
记一次家庭物品管理的折腾:从“收纳”到“可检索”
微信小程序·aicoding·屋册有序·物品收纳管理·家庭收纳管理工具
dreams_dream1 天前
微信小程序:页面事件-上拉触底
微信小程序·小程序
鹏多多1 天前
AI 到底能不能独立做个产品?我拿一个小程序验证了
前端·微信小程序·ai编程
头发还在的女程序员2 天前
基于 Spring Boot + Vue 3 + uni-app 的灵活用工系统:四端架构与业务流程设计
vue.js·spring boot·uni-app·灵活用工·灵工系统
wafrdggh2 天前
2026电商快递批量查询怎么用?固乔助手模板设置评测
大数据·数据库·小程序
计算机毕设定制辅导-无忧学长2 天前
《基于微信小程序的居家医疗陪护预约系统设计与实现》
java·spring boot·微信小程序·uniapp·居家医疗陪护预约系统
wafrdggh3 天前
2026 商城小程序平台哪个价格合理?把跨境附加成本这个坑算透
大数据·小程序
大数据技术派3 天前
我用AI写代码,做了3个小玩意儿
后端·微信小程序
Dumbness3 天前
订阅消息弹窗必须在用户点击里调:联调实验室里 timing 和 Mock 支付通知踩的坑
javascript·uni-app