uniapp微信小程序分享-Toy模板网

这篇具有很好参考价值的文章主要介绍了uniapp微信小程序分享。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

uniapp微信公众号H5端分享：uniapp微信公众号h5端分享_停留的章小鱼的博客-CSDN博客

一、uniapp微信小程序分享（点击右上角胶囊 ··· 分享）

uniapp 小程序分享,微信小程序,uni-app,小程序

1、全局分享（每个页面胶囊都可以分享）

！！！在根目录下新建utils文件夹下新建share.js文件，复制下方代码：

export default {
	data() {
		return {
			// 默认的全局分享内容（待测试）
			share: {
				title: '分享标题',
				path: '/pages/index/index', // 全局分享的路径
				imageUrl: '', // 全局分享的图片(可本地可网络)
			}
		}
	},
	// 定义全局分享
	// 1.发送给朋友
	onShareAppMessage(res) {
		return {
			title: this.share.title,
			path: this.share.path,
			imageUrl: this.share.imageUrl,
		}
	},
	//2.分享到朋友圈
	onShareTimeline(res) {
		return {
			title: this.share.title,
			path: this.share.path,
			imageUrl: this.share.imageUrl,
		}
	},
}

！！！在main.js文件导入并挂载：文章来源地址https://www.toymoban.com/news/detail-531962.html

import share from './utils/share.js'	// 导入并挂载全局的分享方法
Vue.mixin(share)

2、单页面分享：（在onLoad同级挂载）

onShareAppMessage() { // 分享到微信好友
  // 更多参数配置，参考文档
  return {
    title: '分享标题',
    path: '/pages/index/index',
    imageUrl: '图片',
  }
},
onShareTimeline() { // 分享到朋友圈
  return {
    title: '分享标题',
    path: '/pages/index/index',
    imageUrl: '图片',
  }
}

到了这里，关于uniapp微信小程序分享的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！