【uniapp】微信小程序分享朋友圈与聊天

携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第3天，点击查看活动详情

业务场景：

用户使用我们小程序，分享小程序到朋友圈或者聊天，其他用户可以通过分享点击进入小程序并打开指定的页面。分享的小程序要携带分享者标识（页面分享传值一些参数），如果有其他用户（比如新用户）打开可以将其他用户绑定为分享者的下级，算是一种拉新用户的方式吧。

这里的分享方式分为两种：全局分享和自定义分享，我这里主要用到的是自定义分享。

• 小程序：不支持API调用，只能用户主动点击触发分享。可使用自定义按钮方式 或监听系统右上角的分享按钮 onShareAppMessage 进行自定义分享内容

全局分享：

打开小程序，可以通过小程序右上角三个点按钮进行分享。用户点击后将会进入分享的小程序页面。

自定义分享：

<u-button type="warning" :custom-style="btnStyle" shape="circle" open-type="share">立即分享</u-button>

这里可以写一个自定义的button，进行点击分享触发监听事件，并可携带分享的参数。open-type必须为share。

// 分享好友
onShareAppMessage(res) {
        return {
          title: '分享好友得积分',
          path: '/pages/index/index?scene=' + this.userId
        }
  },

title为分享小程序的标题。path为点击小程序后跳转的页面，scene为页面携带的参数。 这里在跳转后的页面的onload方法里可以获取到携带的参数，然后进行业务逻辑处理。

	// 通过二维码进入、分享按钮进入，得到邀请人id参数
	if(e.scene) {
		console.log('获取分享参数，邀请人id:', e.scene)
		uni.setStorageSync('JW-InviterId', e.scene);
	}

uniapp分享相关官方文档

总结：

uniapp对不同平台，分享的调用方式和逻辑有较大差异，这里主要是用到了小程序里面的自定义分享。 uni-app的App引擎已经封装了微信、QQ、微博的分享SDK，也可以分享到微信、QQ、微博等多种形式。