微信小程序实现带参分享并消息卡片获取参数

公司小程序开发已经接近尾声,功能已在测试,现在有个需求,就是小程序分享功能,并在消息卡片打开后数据依然显示。

1 小程序分享

小程序分享功能实现有两种方法

1. onShareAppMessage方法

这种方法用户需要点击页面右上角三个点,下方弹出中选择发送给朋友

41bb196517faef495ee63dc23d4ae83f.png

代码配置在页面js中

onShareAppMessage: function () {
    return {
      title: this.data.details.title,
      path: 'pages/details/details?jobInfoId=' + this.data.details.jobInfoId,
    };
  },

path后面的就是传递的参数,参数与路径之间使用 ? 分隔,参数键与参数值用 = 相连,不同参数用 & 分隔;如 'path?key=value&key2=value2'

2. button标签

这种方式好处是,在页面上任意地方都可以增加分享,不需要用户点击上方三个点

<button plain open-type="share">
  <image src="../../images/share.png"></image>
  <text>我要分享</text>
</button>

页面增加一个按钮,按钮样式自定义,用户点击按钮后触发 Page.onShareAppMessage 事件。就是上面第一种方法,传参一样

2 获取分享传递的参数

小程序获取分享传递的参数只有一种方式,就是在onLoad方法中接收options,从options获取分享传递的参数

Page({
    onLoad: function(options) {
        console.log(options);
    }
})

没发布之前用编辑器,添加编译模式,模拟群聊会话中的小程序消息卡片,可以正确拿到分享传递的参数

be7d0798bbf1e5d18554e31cc297c6dc.png

拿到参数后,即可处理后续逻辑。

posted @ 2022-05-31 18:10  青年码农  阅读(4463)  评论(0编辑  收藏  举报