需求说明

嵌套在微信小程序中的H5想要使用小程序自带分享功能,分享H5的页面给微信好友或朋友圈

实现原理

H5中可使用wx.miniProgram.postMessage向小程序的webview发送消息,会触发组件的message事件,在小程序webview页面onShareAppMessage,onShareTimeline中进行使用。

代码实现

1. 在需要分享的H5页面,设置分享的相关参数。

wxSdk.miniProgram.postMessage({//wxSdk为微信sdk

data: {

shareTitle: shareTitle,//自定义

shareUrl: shareUrl//自定义

}

})

2.小程序页面接收参数

handleMessage(evt) {

this.shareTitle = evt.detail.shareTitle ;

this.shareUrl = evt.detail.shareUrl;

},

3.分享微信好友或朋友圈

onShareAppMessage() {

return {

title: this.shareTitle ,

path: this.shareUrl,

};

},

onShareTimeline() {

return {

title: this.shareTitle ,

path: this.shareUrl,

};

},

4.实现效果

推荐阅读

评论可见,请评论后查看内容,谢谢!!!
 您阅读本篇文章共花了: