微信小程序中的(de)分享事件
發表時(shí)間:2021-3-31
發布人(rén):融晨科技
浏覽次數:52
小程序的(de)分享 onShareAppMessage(options)
在(zài)頁面的(de)js文件中定義了(le/liǎo) onShareAppMessage 函數時(shí),頁面可以(yǐ)表示改頁面可以(yǐ)轉發。可以(yǐ)在(zài)函數中設置頁面轉發的(de)信息。
- 隻有定義了(le/liǎo)該函數,小程序右上(shàng)角的(de)菜單中才會有轉發按鈕
- 用戶點擊轉發按鈕的(de)時(shí)候回調用該函數
- 該函數内需要(yào / yāo) return 一個(gè) Object,Object中包含轉發的(de)信息(可自定義轉發的(de)内容)
頁面中有可以(yǐ)觸發轉發時(shí)間的(de)地(dì / de)方有兩個(gè):
一個(gè)是(shì)右上(shàng)角菜單中的(de)轉發按鈕
另一個(gè)是(shì)頁面中具有屬性open-type且其值爲(wéi / wèi)share的(de)button。(注:必須是(shì)button組件,其他(tā)組件中設置 open-type="share" 無效)
即:
注意:實際開發中會發現這(zhè)個(gè) button 自帶有樣式,當背景顔色設置爲(wéi / wèi)白色的(de)時(shí)候還有一個(gè)黑色的(de)邊框,剛開始那個(gè)邊框怎麽都去不(bù)掉,後來(lái)給button加了(le/liǎo)一個(gè)樣式屬性 plain="true" 以(yǐ)後,再在(zài)樣式文件中控制樣式 button[plain]{ border:0 } ,就(jiù)可以(yǐ)比較随便的(de)自定義樣式了(le/liǎo),比如說(shuō)将分享按鈕做成一個(gè)圖标等
觸發分享事件後調用的(de)函數:
onShareAppMessage: function( options ){
var that = this;
// 設置菜單中的(de)轉發按鈕觸發轉發事件時(shí)的(de)轉發内容
var shareObj = {
title: "轉發的(de)标題", // 默認是(shì)小程序的(de)名稱(可以(yǐ)寫slogan等)
path: '/pages/share/share', // 默認是(shì)當前頁面,必須是(shì)以(yǐ)‘/’開頭的(de)完整路徑
imgUrl: '', //自定義圖片路徑,可以(yǐ)是(shì)本地(dì / de)文件路徑、代碼包文件路徑或者網絡圖片路徑,支持PNG及JPG,不(bù)傳入 imageUrl 則使用默認截圖。顯示圖片長寬比是(shì) 5:4
success: function(res){
// 轉發成功之(zhī)後的(de)回調
if(res.errMsg == 'shareAppMessage:ok'){
}
},
fail: function(){
// 轉發失敗之(zhī)後的(de)回調
if(res.errMsg == 'shareAppMessage:fail cancel'){
// 用戶取消轉發
}else if(res.errMsg == 'shareAppMessage:fail'){
// 轉發失敗,其中 detail message 爲(wéi / wèi)詳細失敗信息
}
},
complete: fucntion(){
// 轉發結束之(zhī)後的(de)回調(轉發成不(bù)成功都會執行)
}
};
// 來(lái)自頁面内的(de)按鈕的(de)轉發
if( options.from == 'button' ){
var eData = https://www.wxapp-union.com/options.target.dataset;
console.log( eData.name ); // shareBtn
// 此處可以(yǐ)修改 shareObj 中的(de)内容
shareObj.path = '/pages/btnname/btnname?btn_name='+eData.name;
}
// 返回shareObj
return shareObj;
}