僅在 微信小程序 & 字節(jié)(抖音)小程序 中驗證過
分享調(diào)用流程
借用字節(jié)小程序文檔中的圖憔晒,原文地址苍苞,微信小程序的原理也是一致的
image.png
從上圖中可以看出,調(diào)用 onShareAppMessage 的 時機就是用戶點擊了菜單中的分享 或者 自定義的分享按鈕 時候
自定義分享參數(shù)
- 注冊 onShareAppMessage
此事件需要在 頁面中 注冊销斟,組件中注冊是無效的。但是執(zhí)行分享的操作是可以在組件中的,最終會觸發(fā)這些組件所在的頁面的 onShareAppMessage 方法咐鹤。
import { onShareAppMessage } from "@dcloudio/uni-app";
onShareAppMessage((options) => {
console.log('獲得的參數(shù):', options);
// let { path, title, imageUrl } = options.target.dataset.share;
return {
title: "個人主頁",
desc: "測試的內(nèi)容",
path: "/pages/user/index",
imageUrl: "https://we-retail-static-1300977798.cos.ap-guangzhou.myqcloud.com/retail-ui/components-exp/avatar/avatar-1.jpg"
};
})
- Button 中定義分享參數(shù)
<button class="btn-init"
open-type="share"
:data-share="{
title: '啦啦啦',
path: '11111',
imageUrl: 'https://we-retail-static-1300977798.cos.ap-guangzhou.myqcloud.com/retail-ui/components-exp/avatar/avatar-1.jpg'
}"
>
<view class="cell-item">
<view class="cell-title">
<view>頁面分享</view>
</view>
<image style="width: 20px; height: 20px; display: block;" src="@/static/icon/arrow_right.svg" />
</view>
</button>
data-share 中的就是自定義的參數(shù)戏售,將會在 onShareAppMessage 的 options 中獲取
image.png
可以依據(jù)上面的參數(shù)進(jìn)行各種行為的數(shù)據(jù)處理
總結(jié)
只要保證數(shù)據(jù)能在觸發(fā)分享函數(shù)之前獲取成功侨核,即可讓自定義分享成功。