uniapp onsharetimeline 的使用方法

在uni-app中如何正确使用onShareTimeline方法？我在小程序中调用这个分享朋友圈功能时总是无法触发，官方文档说需要配置path参数，但具体应该如何配置？另外这个方法在不同平台（微信/QQ等）的兼容性如何？有没有完整的代码示例可以参考？

2 回复

在页面中定义onShareTimeline方法，返回分享内容对象：

onShareTimeline() {
  return {
    title: '分享标题',
    imageUrl: '图片路径'
  }
}

需在manifest.json中配置分享权限。


在 UniApp 中，onShareTimeline 是用于自定义分享到微信朋友圈功能的生命周期函数。以下是使用方法：

基本步骤

  1. 在页面中定义 onShareTimeline 函数：
    在页面的 .vue 文件中的 <script> 部分添加此函数，返回一个配置对象。

  2. 配置分享内容：
    通过返回对象设置标题、图片、查询参数等。

  3. 启用分享功能：
    确保在 manifest.json 中已配置微信小程序相关设置。

示例代码

export default {
  onShareTimeline() {
    return {
      title: '分享标题', // 自定义标题
      path: '/pages/index/index', // 分享路径，默认当前页面路径
      imageUrl: '/static/share.png' // 自定义图片路径（可选）
    }
  }
}

注意事项

  • 仅微信小程序支持：此功能仅在微信小程序平台生效，其他平台（如 H5、App）需使用其他分享方式。
  • 路径参数：path 可带参数，例如 /pages/index?id=123。
  • 图片限制：图片建议使用本地路径，网络图片需先下载到本地。

完整示例

<template>
  <view>
    <text>分享到朋友圈示例页面</text>
  </view>
</template>

<script>
export default {
  onShareTimeline() {
    return {
      title: '欢迎使用UniApp',
      path: '/pages/index/index',
      imageUrl: '/static/logo.png'
    }
  }
}
</script>

调试提示

  • 在微信开发者工具中，点击右上角“转发”按钮测试分享效果。
  • 确保小程序已开通分享权限。

如果遇到问题，检查 manifest.json 中的微信小程序 AppID 配置是否正确。

回到顶部