由于小程序的分享(微信、頭條平臺(tái))，需要監(jiān)聽頁面的onShareAppMessage生命周期，小程序需要在頁面聲明了此生命周期，點(diǎn)擊右上角的"膠囊"才會(huì)有分享功能，

而一般情況下，我們希望每個(gè)頁面都可以分享，那就需要每個(gè)頁面都寫一遍這個(gè)生命周期，是很繁瑣的。

基于以上，開源字節(jié)基于uview通過mixin的形式，給每一個(gè)頁面注入了onShareAppMessage生命周期，讓您簡(jiǎn)單引入，無需任何后續(xù)操作，即可讓每一個(gè)頁面都有分享功能(僅針對(duì)小程序)。

基本使用

需要注意的是，小程序(uni)沒有提供類似"getNavigationBarTitle"這樣的接口，所以我們無法獲取當(dāng)前頁面導(dǎo)航欄的標(biāo)題，換言之，我們想要每個(gè)頁面?zhèn)€性化的分享標(biāo)題，需要手動(dòng)設(shè)置，否則默認(rèn)為小程序的名稱。

首先在main.js中引入對(duì)應(yīng)的文件

let mpShare = require('uview-ui/libs/mixin/mpShare.js');Vue.mixin(mpShare)

通過this.$u.mpShare定義分享信息

// 分享自定義標(biāo)題與圖片let shareTitle = ''if(room.type == '整租'){shareTitle = this.village.name + " " + this.room.houseNum + this.room.houseHall + this.room.toiletNum + " " + this.room.decoration+ " ¥" + this.room.price+"/月"}else{shareTitle = this.village.name + " " + room.roomType + " " + this.room.decoration+  " ¥" + this.room.price+"/月"}this.$u.mpShare = {title:  shareTitle, // 默認(rèn)為小程序名稱，可自定義// 支持PNG及JPG，默認(rèn)為當(dāng)前頁面的截圖imageUrl: this.room.faceUrl, }

開源字節(jié)追求用更簡(jiǎn)單的邏輯，更少的代碼實(shí)現(xiàn)更復(fù)雜的功能。以上代碼在開源字節(jié)的租房小程序中都已開源上線，可前往倉(cāng)庫(kù)獲取源碼

如若轉(zhuǎn)載，請(qǐng)注明出處：開源字節(jié)
https://sourcebyte.cn/article/210.html