Hbuildx 使用vue打包的App实现微信分享功能

最新推荐文章于 2025-03-07 17:20:38 发布

原创

最新推荐文章于 2025-03-07 17:20:38 发布 · 952 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#App #vue #plus #Hbuildx #微信分享

本文介绍使用vue+h5+plus技术，结合hbuildx打包的App，实现将页面分享到微信朋友圈及好友的方法。还提及分享参数，如链接、消息类型、缩略图、标题和文字内容等，同时指出分享链接在App环境的注意事项。

前言：
本文章使用的是vue+h5+plus技术，结合hbuildx打包的App，实现在App中分享页面到朋友圈以及好友。

下面贴码介绍：

<nut-popup v-model="isVisible" position="bottom">
		分享到
		<div class="custom-wrap">
				<div @click="shareWX('WXSceneSession')">
					<img src="@/assets/images/weixin.png" alt="">
					<div>微信</div>
				</div>
				<div style="margin-left:20px;" @click="shareWX('WXSceneTimeline')">
					<img src="@/assets/images/pengyouquan.png" alt="">
					<div>朋友圈</div>
				</div>
		</div>
</nut-popup>

在shareWX()这个方法中，如果是分享到好友传值'WXSceneSession'分享到朋友圈传值'WXSceneTimeline'

shareWX(scene){
	let _this=this
	let msg = {
		type: "web",
		thumbs: ['@/assets/images/cxy28.jpg'],
		title:_this.detailHtml.title,
		content:_this.detailHtml.title,
		href: `https://xxxx