uniapp--小程序全局开启发送给朋友,分享朋友圈

1,358 阅读1分钟

uniapp--小程序全局开启发送给朋友,分享朋友圈,全局配置分享默认值,单页面可修改内容分享

1、在根目录新建utils目录,新建一个share.js

export default {
	data() {
		return {
			//设置默认的分享参数
			//如果页面不设置share,就触发这个默认的分享
			share: {
				title: ’全局默认标题',
				path: `/pages/index/index`,  //默认跳转首页
				imageUrl: '',  //可设置默认分享图,不设置默认截取头部5:4
			}
		}
	},
	onShareAppMessage(res) { //发送给朋友
		return {
			title: this.share.title,
			path: this.share.path,
			imageUrl: this.share.imageUrl,
			success(res) {
				console.log('success(res)==', res);
				uni.showToast({
					title: '分享成功'
				})
			},
			fail(res) {
				console.log('fail(res)==', res);
				uni.showToast({
					title: '分享失败',
					icon: 'none'
				})
			}
		}
	},
	onShareTimeline(res) { //分享到朋友圈
		return {
			title: this.share.title,
			path: this.share.path,
			imageUrl: this.share.imageUrl,
			success(res) {
				console.log('success(res)==', res);
				uni.showToast({
					title: '分享成功'
				})
			},
			fail(res) {
				console.log('fail(res)==', res);
				uni.showToast({
					title: '分享失败',
					icon: 'none'
				})
			}
		}
	},
}

main.js全局引用,激活分享

// 小程序分享的封装
import share from "./utils/share.js"
Vue.mixin(share)

单页面配置分享内容

<script>
	export default {
		data() {
			return {
				title: 'Hello'
				share:{
					title: ’页面标题',
					path: `/pages/default/default`,  //页面路径
					imageUrl: '',  //页面图,可自定义
				}
			}
		},
		//引入单页面配置
		onShareAppMessage(res) {
			if (res.from === 'button') {
				console.log('来自页面内分享按钮');
				console.log(res.target);
			}
			return {
				title: this.share.title,
				path:  this.share.path,
				imageUrl:  this.share.imageUrl,
				success(res) {
					console.log('分享成功');
				},
				fail(res) {
					console.log('分享失败');
				}
			};
		},
		onLoad() {

		},
		methods: {

		}
	}
</script>

有需要可加交流群交流(857064044)交流群