如何使用 onShareTimeline 自定义“分享到朋友圈”按钮的分享内容？ (小程序已废弃该接口)

推荐答案

// www.javascriptcn.com code example
Page({
  onShareTimeline() {
    return {
      title: '自定义标题',
      query: 'from=share', // 自定义参数
      imageUrl: 'https://example.com/image.png' // 自定义图片
    };
  }
});

本题详细解读

1. onShareTimeline 接口的作用

onShareTimeline 是微信小程序中用于自定义“分享到朋友圈”按钮分享内容的接口。通过实现这个接口，开发者可以自定义分享的标题、参数和图片等内容。

2. 接口返回值

onShareTimeline 接口需要返回一个对象，该对象包含以下字段：

• title: 分享的标题，用户可以在朋友圈看到这个标题。
• query: 自定义参数，用户点击分享内容后，可以通过 onLoad 或 onShow 等生命周期函数获取这些参数。
• imageUrl: 分享的图片链接，用户可以在朋友圈看到这张图片。

3. 示例代码解析

在示例代码中，onShareTimeline 返回了一个对象，其中：

• title 设置为 '自定义标题'，用户分享到朋友圈时会显示这个标题。
• query 设置为 'from=share'，用户点击分享内容后，可以通过 options.query 获取到这个参数。
• imageUrl 设置为 'https://example.com/image.png'，用户分享到朋友圈时会显示这张图片。

4. 注意事项

• onShareTimeline 接口在小程序基础库 2.11.3 及以上版本中已被废弃，建议使用 wx.showShareMenu 和 wx.onShareAppMessage 来实现类似功能。
• 如果小程序需要支持更低版本的基础库，建议同时实现 onShareAppMessage 接口，以确保兼容性。

5. 兼容性处理

由于 onShareTimeline 已被废弃，建议使用以下代码来处理兼容性：

// www.javascriptcn.com code example
Page({
  onLoad() {
    if (wx.showShareMenu) {
      wx.showShareMenu({
        withShareTicket: true,
        menus: ['shareAppMessage', 'shareTimeline']
      });
    }
  },
  onShareAppMessage() {
    return {
      title: '自定义标题',
      path: '/pages/index/index?from=share',
      imageUrl: 'https://example.com/image.png'
    };
  }
});

通过这种方式，可以在支持 onShareTimeline 的版本中继续使用该功能，同时在更高版本中使用新的分享接口。