微信小程序分享功能

發布時間：2023-07-02 23:44:36 作者：網友整理

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

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

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

基本使用

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

首先在main.js中引入對應的文件

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

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

// 分享自定義標題與圖片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, // 默認為小程序名稱，可自定義// 支持PNG及JPG，默認為當前頁面的截圖imageUrl: this.room.faceUrl, }

開源字節追求用更簡單的邏輯，更少的代碼實現更復雜的功能。以上代碼在開源字節的租房小程序中都已開源上線，可前往倉庫獲取源碼