uniapp 微信小程序分享功能

微信小程序分享功能、传参、接收参数

1,分享功能
在页面上与methods同级写上onShareAppMessage()函数。

onShareAppMessage() {
			return{
				title: "xxx欢迎你",//分享标题
				path: "/pages/detail/detail",//页面 path ,必须是以 / 开头的完整路径。
				//分享图标,路径可以是本地文件路径、代码包文件路径或者网络图片路径。支持PNG及JPG。显示图片长宽比是 5:4,我这里直接用的百度图片
				imageUrl: "https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fnimg.ws.126.net%2F%3Furl%3Dhttp%3A%2F%2Fdingyue.ws.126.net%2F2021%2F0128%2F6cd17366j00qnmnle008uc000vk00xcm.jpg%26thumbnail%3D650x2147483647%26quality%3D80%26type%3Djpg&refer=http%3A%2F%2Fnimg.ws.126.net&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1643177153&t=0a54d622654f2169d76bdfbf25ebbed8",
				//接口调用成功的回调函数
				success(res){
					uni.showToast({
						title:'分享成功'
					})
				},
				//接口调用失败的回调函数
				fail(res){
					uni.showToast({
						title:'分享失败',
						icon:'none'
					})
				}
			}
		},

这个函数是触发分享给朋友的函数。
title、path、imgUrl为自定义的分享内容。更多参数可看官方文档onShareAppMessage
2,传参和接收参数
传参就是在path路径后面加参数

path: "/pages/detail/detail?code=qwertyu12345678",

接收参数可以在页面的onLoad生命周期里面接收
options就包含着参数

onLoad(options) {
	if(options.code){
		this.params = options.code;
	}
},

还可以在入口文件内接收,即在app.vue页面用onLaunch()应用生命周期接收

onLaunch(options){
	id(options.code){
		let params = options.code;
	}
}

效果图
uniapp 微信小程序分享功能_第1张图片

你可能感兴趣的:(uniapp,微信小程序,前端)