微信小程序中的分享事件

小程序的分享 onShareAppMessage(options)

 

在頁面的js文件中定義了 onShareAppMessage 函數時，頁面可以表示改頁面可以轉發。可以在函數中設置頁面轉發的信息。

1. 只有定義了該函數，小程序右上角的菜單中才會有轉發按鈕

2. 用戶點擊轉發按鈕的時候回調用該函數

3. 該函數內需要 return 一個 Object，Object中包含轉發的信息（可自定義轉發的內容）

 

頁面中有可以觸發轉發事件的地方有兩個：

　　一個是右上角菜單中的轉發按鈕

　　另一個是頁面中具有屬性open-type且其值為share的button。（注：必須是button組件，其他組件中設置 open-type="share" 無效）

　　即：<button data-name="shareBtn" open-type="share">轉發</button>

　　注意：實際開發中會發現這個 button 自帶有樣式，當背景顏色設置為白色的時候還有一個黑色的邊框，剛開始那個邊框怎么都去不掉，后來給button加了一個樣式屬性 plain="true" 以后，再在樣式文件中控制樣式 button[plain]{ border:0 } ，就可以比較隨便的自定義樣式了，比如說將分享按鈕做成一個圖標等

 

觸發分享事件后調用的函數：

onShareAppMessage: function( options ){
　　var that = this;
　　// 設置菜單中的轉發按鈕觸發轉發事件時的轉發內容
　　var shareObj = {
　　　　title: "轉發的標題",        // 默認是小程序的名稱(可以寫slogan等)
　　　　path: '/pages/share/share',        // 默認是當前頁面，必須是以‘/’開頭的完整路徑
　　　　imgUrl: '',     //自定義圖片路徑，可以是本地文件路徑、代碼包文件路徑或者網絡圖片路徑，支持PNG及JPG，不傳入 imageUrl 則使用默認截圖。顯示圖片長寬比是 5:4
　　　　success: function(res){
　　　　　　// 轉發成功之后的回調
　　　　　　if(res.errMsg == 'shareAppMessage:ok'){
　　　　　　}
　　　　},
　　　　fail: function(){
　　　　　　// 轉發失敗之后的回調
　　　　　　if(res.errMsg == 'shareAppMessage:fail cancel'){
　　　　　　　　// 用戶取消轉發
　　　　　　}else if(res.errMsg == 'shareAppMessage:fail'){
　　　　　　　　// 轉發失敗，其中 detail message 為詳細失敗信息
　　　　　　}
　　　　},
　　　　complete: function(){
　　　　　　// 轉發結束之后的回調（轉發成不成功都會執行）
　　　　}
　　};
　　// 來自頁面內的按鈕的轉發
　　if( options.from == 'button' ){
　　　　var eData = options.target.dataset;
　　　　console.log( eData.name );     // shareBtn
　　　　// 此處可以修改 shareObj 中的內容
　　　　shareObj.path = '/pages/btnname/btnname?btn_name='+eData.name;
　　}
　　// 返回shareObj
　　return shareObj;
}