在開發微信小程序的時候,發現【發送給朋友】、【分享到朋友圈】、【復制鏈接】功能,灰色不可用。
很常見的功能,但是這幾個功能,并不是你項目建起來了就有的。
1.【發送給朋友】使用 onShareAppMessage 這個方法
如果你的小程序,發現他的【轉發給朋友】的按鈕時灰色的,不能點擊,那么說明這個小程序沒有寫這部分的代碼。
2.【分享到朋友圈】使用 onShareTimeline 方法
onShareAppMessage和onShareTimeline方法有一個坑,就是每個頁面都得單獨寫一份。
3.【復制鏈接】注意這個功能不需要開發者手動寫方法,如果【轉發給朋友】這個功能灰色不可用,【復制鏈接】也會不可用。總之想要復制鏈接,就先開通【轉發給朋友】吧。
開發過小程序的朋友們應該都遇到這樣的情況,可能很多個頁面有相同的函數,例如onShareAppMessage,有什么最佳實踐嗎,應該如何處理呢?
uniapp實現微信小程序全局【發送給朋友】、【分享到朋友圈】、【復制鏈接】
主要使用 Vue.js 的 全局混入
1.創建一個全局分享的js文件。示例文件路徑為:./utils/share.js ,在該文件中定義全局分享的內容:
export default {
data() {
return {}
},
//1.發送給朋友
onShareAppMessage() {},
//2.分享到朋友圈
onShareTimeline() {},
}
2.在項目的 main.js 文件中引入該 share.js 文件并使用 Vue.mixin() 方法將之全局混入:
// 導入并掛載全局的分享方法
import share from './utils/share.js'
Vue.mixin(share)
3.如果在特定頁面需要自定義分享內容,也仍舊可以使用頁面的 onShareAppMessage() 和 onShareTimeline() 方法自定義分享的內容,全局的分享會被頁面定義的分享內容覆蓋。