（干貨）微信小程序轉(zhuǎn)發(fā)好友
|
今天簡(jiǎn)單地說(shuō)下微信小程序的轉(zhuǎn)發(fā)功能，為什么要簡(jiǎn)單的說(shuō)下呢，因?yàn)橹饕v的就是轉(zhuǎn)發(fā)給好友或者群組，還有一種是分享到朋友圈，這種就比較復(fù)雜一點(diǎn)了，先稍微透漏一點(diǎn)，分享到朋友圈主要是兩種方法，一種是后臺(tái)直接生成海報(bào)圖，一種是前端通過(guò)canvas生成海報(bào)。以后有機(jī)會(huì)再詳細(xì)說(shuō)，好了，言歸正傳繼續(xù)說(shuō)我們的轉(zhuǎn)發(fā)好友。 首先介紹一個(gè)微信小程序的API：onShareAppMessage(options) 在 Page 中定義 onShareAppMessage 函數(shù)，設(shè)置該頁(yè)面的轉(zhuǎn)發(fā)信息。
options 參數(shù)說(shuō)明
自定義轉(zhuǎn)發(fā)字段
還有一個(gè)值那就是shareTickets他是轉(zhuǎn)發(fā)成功返回的，并且是個(gè)數(shù)組，每一項(xiàng)是一個(gè) shareTicket ，對(duì)應(yīng)一個(gè)轉(zhuǎn)發(fā)對(duì)象 API先說(shuō)到這，接下來(lái)就是轉(zhuǎn)發(fā)的實(shí)現(xiàn) 先看圖：
首先要在onLoad中配置wx.showShareMenu
onLoad: function (e) {
wx.showShareMenu({
// 要求小程序返回分享目標(biāo)信息
withShareTicket: true
});
},
然后再配置onShareAppMessage
/* 轉(zhuǎn)發(fā)*/
onShareAppMessage: function (ops) {
if (ops.from === 'button') {
// 來(lái)自頁(yè)面內(nèi)轉(zhuǎn)發(fā)按鈕
console.log(ops.target)
}
return {
title: '轉(zhuǎn)發(fā)dom',
path: `pages/index/index`,
success: function (res) {
// 轉(zhuǎn)發(fā)成功
console.log("轉(zhuǎn)發(fā)成功:" + JSON.stringify(res));
var shareTickets = res.shareTickets;
// if (shareTickets.length == 0) {
// return false;
// }
// //可以獲取群組信息
// wx.getShareInfo({
// shareTicket: shareTickets[0],
// success: function (res) {
// console.log(res)
// }
// })
},
fail: function (res) {
// 轉(zhuǎn)發(fā)失敗
console.log("轉(zhuǎn)發(fā)失敗:" + JSON.stringify(res));
}
}
},
我解釋一下wx.getShareInfo這個(gè)可以獲取到獲取轉(zhuǎn)發(fā)詳細(xì)信息 完整js代碼就是
//index.js
//獲取應(yīng)用實(shí)例
const app = getApp()
Page({
data: {
motto: 'Hello World',
},
onLoad: function (e) {
wx.showShareMenu({
// 要求小程序返回分享目標(biāo)信息
withShareTicket: true
});
},
/* 轉(zhuǎn)發(fā)*/
onShareAppMessage: function (ops) {
if (ops.from === 'button') {
// 來(lái)自頁(yè)面內(nèi)轉(zhuǎn)發(fā)按鈕
console.log(ops.target)
}
return {
title: '轉(zhuǎn)發(fā)dom',
path: `pages/index/index`,
success: function (res) {
// 轉(zhuǎn)發(fā)成功
console.log("轉(zhuǎn)發(fā)成功:" + JSON.stringify(res));
var shareTickets = res.shareTickets;
// if (shareTickets.length == 0) {
// return false;
// }
// //可以獲取群組信息
// wx.getShareInfo({
// shareTicket: shareTickets[0],
// success: function (res) {
// console.log(res)
// }
// })
},
fail: function (res) {
// 轉(zhuǎn)發(fā)失敗
console.log("轉(zhuǎn)發(fā)失敗:" + JSON.stringify(res));
}
}
},
})
聰明的同學(xué)就該知道接下來(lái)該是wxml代碼
<view class="container">
<view class="userinfo">
<button open-type="share">分享好友</button>
</view>
<view class="usermotto">
<text class="user-motto">{{motto}}</text>
</view>
</view>
友情提示一下如果點(diǎn)擊按鈕分享的話，button一定要設(shè)置open-type="share"否則不起作用。
如果覺得文章還不錯(cuò)并對(duì)你有幫助的話，請(qǐng)分享給你的小伙伴，并點(diǎn)贊，有什么不懂得可以在底下留言哦。
|
zz
