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