微信小程序自定义组件内分享功能

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/RELY_ON_YOURSELF/article/details/82493387

业务需要 : 在自定义组件中有一个分享按钮 , 分享按钮一般是button组件 , 然后设置open-type=’share’ , 接着在onShareAppMessage方法中配置分享信息 , 这时候坑来了 , onShareAppMessage只是存在于page中的 , 在自定义组件中是无法回调的 , 先看看官方文档.

---

解决方案 : 虽然组件中无法回调onShareAppMessage方法 , 但是page中可以回调啊 . 可是一个page中有可能有多个分享按钮 , 我怎么知道是哪个按钮的分享呢 ? 只能在button中把需要的数据传出去 . 通过data- 将需要的数据传出去.

 <button class='share-btn' open-type='share' data-shareModel='{{cardOperationData.operationList[0]}}'>分享至微信</button>

然后在onShareAppMessage方法中接收数据:

onShareAppMessage: function (res) {
    let shareModel = res.target.dataset.sharemodel;
    if (res.from === 'button') {
      // 来自页面内转发按钮
    }
    return {
      title: shareModel.title,
      path: shareModel.path,
      imageUrl: shareModel.imageUrl
    }
  },

这时候就可以知道分享按钮的数据了.
但是这种方式还是有坑的 , 就是如果你想用微信小程序默认的截图 , 这是有坑的 , 这个截图不好控制 .
我这边用的分享图是从组件传过来的自己设计的图片 , 而不是小程序自动截图的图片 .