微信小程序「分享到朋友圈」功能怎么写?微信朋友圈分享怎么实现?

2020-08-07  本文已影响0人  LauEl

微信最近开放了微信小程序分享到朋友圈的接口。
目前此功能没有完全放开,需微信安卓7.0.16版本才支持,灰度测试 ,iOS版本暂不支持。

想让小程序提供“分享到朋友圈”的功能,小程序端需要通过调用wx.showShareMenu 这个api,支持此功能,具体的操作步骤如下:

1.设置“调试基础库”的版本

wx.showShareMenu api支持分享朋友圈的功能参数“menus”需要基础库2.11版本以上,因此首先在微信小程序开发工具里设置基础库为2.11版本以上

image

设置完成后,在点击小程序右上角的三个点,会出现“分享到朋友圈”的按钮,不过是灰色的,无法触发。

不得不说朋友圈的入口才是最大的流量池。

image.png

具体代码实现功能(供参考)
首先最简单的就是使用小程序的生命函数

 onLoad() {
   //直接写入这里监听
wx.showShareMenu({
      withShareTicket: true,
      menus: ['shareAppMessage', 'shareTimeline']
    })
  },

这样写的话会默认分享的时候是小程序的logo和小程序的主页。

那我们也可以这样监听

 /**
   * 分享当前页面
   */
  onShareAppMessage: function() {
    wx.showShareMenu({
      withShareTicket: true,
      menus: ['shareAppMessage', 'shareTimeline']
    })
  },
  //用户点击右上角分享朋友圈
  onShareTimeline: function () {
      let _this = this;
      // 构建页面参数
      let params = App.getShareUrlParams({
        'goods_id': _this.data.goods_id
      });
    return {
//titile就是分享名称  query为分享进入链接,imageurl就是图片相对获取就可以
      title: _this.data.detail.goods_name,
      query: {
        key: "/pages/goods/index" +  _this.data.detail.goods_id
      },
      imageUrl: _this.data.detail.goods_image,
    }
  },

效果:

image.png
image.png
image.png
上一篇 下一篇

猜你喜欢

热点阅读