uni-app 微信小程序分享功能

官方文档:https://uniapp.dcloud.io/api/plugins/share?id=onshareappmessage 

方式1:小程序右上角原生菜单自带的分享按钮

 

 方式2:或者是在页面中放置的分享按钮 <button>

<button class="separate-fl" plain="true" data-name="shareBtn" open-type="share">
           <text class="icon-fenxiang iconfont"></text>
            <text class="separate-text">分享</text>                     
 </button>

这两种分享都会触发 onShareAppMessage 函数,在js 中定义该函数,设置页面分享的信息,注意:该函数和 onLoad 等生命周期函数同级

效果图如下:

 

分享到微信朋友圈功能

需要先在 onLoad 生命周期函数中调用 wx.showShareMenu 才能显示分享按钮

 

onLoad(){

    //设置下方的Menus菜单,才能够让发送给朋友与分享到朋友圈两个按钮可以点击
    wx.showShareMenu({
        withShareTicket:true,
        menus:["shareAppMessage","shareTimeline"]
    })
},

//发送给朋友
onShareAppMessage(res) {
      return {
            title: this.goods.name,  

            path: `/pages/product/product?id=${this.goods.id}`
        }
},
//分享到朋友圈
onShareTimeline(res) {
     return {
            title: '',
            type: 0,
            query: 0,
            summary: "",
            imageUrl: ""
        }
},

注意事项
分享给朋友圈功能是2020年7月份新增的功能,目前仅支持安卓,IOS不支持
目前是内测阶段,部分功能还是有问题的,例如分享到朋友圈功能,其中的query参数,这个参数在onLoad中是获取不到的,也就是说从此页面分享出去的,其他人进入此页面是拿不到分享者的信息的。这样就不能做分享者与用户之间的关联了

  • 4
    点赞
  • 20
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值