小程序如何分享鏈接onShareAppMessage

發(fā)布時(shí)間：2020-07-22 15:32:49 來(lái)源：億速云閱讀：786 作者：小豬欄目：web開(kāi)發(fā)

小編這次要給大家分享的是小程序如何分享鏈接onShareAppMessage，文章內(nèi)容豐富，感興趣的小伙伴可以來(lái)了解一下，希望大家閱讀完這篇文章之后能夠有所收獲。

onShareAppMessage用法：

只需要在button標(biāo)簽中加入open-type="share"，小程序ui就會(huì)自動(dòng)識(shí)別分享鏈接功能

<button data-name="shareBtn" open-type="share">分享</button>

js中代碼如下：

onShareAppMessage: function( options ){
　　var that = this;
　　// 設(shè)置菜單中的轉(zhuǎn)發(fā)按鈕觸發(fā)轉(zhuǎn)發(fā)事件時(shí)的轉(zhuǎn)發(fā)內(nèi)容
　　var shareObj = {
　　　　title: "轉(zhuǎn)發(fā)的標(biāo)題",    // 默認(rèn)是小程序的名稱(可以寫(xiě)slogan等)
　　　　path: '/pages/share/share',    // 默認(rèn)是當(dāng)前頁(yè)面，必須是以‘/'開(kāi)頭的完整路徑
　　　　imageUrl: '',   //自定義圖片路徑，可以是本地文件路徑、代碼包文件路徑或者網(wǎng)絡(luò)圖片路徑，支持PNG及JPG，不傳入 imageUrl 則使用默認(rèn)截圖。顯示圖片長(zhǎng)寬比是 5:4
　　　　success: function(res){
　　　　　　// 轉(zhuǎn)發(fā)成功之后的回調(diào)
　　　　　　if(res.errMsg == 'shareAppMessage:ok'){
　　　　　　}
　　　　},
　　　　fail: function(){
　　　　　　// 轉(zhuǎn)發(fā)失敗之后的回調(diào)
　　　　　　if(res.errMsg == 'shareAppMessage:fail cancel'){
　　　　　　　　// 用戶取消轉(zhuǎn)發(fā)
　　　　　　}else if(res.errMsg == 'shareAppMessage:fail'){
　　　　　　　　// 轉(zhuǎn)發(fā)失敗，其中 detail message 為詳細(xì)失敗信息
　　　　　　}
　　　　},
　　　　complete: fucntion(){
　　　　　　// 轉(zhuǎn)發(fā)結(jié)束之后的回調(diào)（轉(zhuǎn)發(fā)成不成功都會(huì)執(zhí)行）
　　　　}
　　};
　　// 來(lái)自頁(yè)面內(nèi)的按鈕的轉(zhuǎn)發(fā)
　　if( options.from == 'button' ){
　　　　var eData = options.target.dataset;
　　　　console.log( eData.id);   // shareBtn
　　　　// 此處可以修改 shareObj 中的內(nèi)容
　　　　shareObj.path = '/pages/goods/goods&#63;goodId='+eData.id;
　　}
　　// 返回shareObj
　　return shareObj;
}

在實(shí)際應(yīng)用中，會(huì)碰到這種情況：

微信小程序分享時(shí)，需要調(diào)用一個(gè)ajax（Promise）請(qǐng)求，然后return 一個(gè)對(duì)象，怎么同步實(shí)現(xiàn)？

比如：微信小程序分享時(shí)會(huì)調(diào)用 onShareAppMessage 方法，他會(huì)return 一個(gè)對(duì)象作為分享時(shí)的參數(shù)。但是我需要在他return之前調(diào)用一個(gè)ajax方法getShareCode，怎么樣同步實(shí)現(xiàn)？

//將字符串鏈接轉(zhuǎn)為二維碼，如：轉(zhuǎn)換前 itemid/344*fromuser/4909*shopid/75，轉(zhuǎn)換后 KtIQE4j9OP4JNGS2dsZy
getShareCode: function () {
  var that = this;
  util.request(api.CreateShareCode, {
   sharecode: 'itemid/' + that.data.productid + '*fromuser/' + user.getBuyerUserId() + '*shopid/' + that.data.shopId
  }).then(function (res) {

   if (res.statusCode === 0) {
    that.setData({ newShareCode: res.sharedata });
   }
  });
 },

 //分享功能
 onShareAppMessage: function () {
  this.getShareCode();
  let that = this;
  var newShareCode = that.data.newShareCode;
  var shareBackUrl = 'pages/goods/goods&#63;scene=' + newShareCode;
  return {
   title: that.data.goods.title,
   path: shareBackUrl
  }
 },

嘗試用async await 和 Promise都沒(méi)有得到想要的結(jié)果。

不能用async await原因是，如果 onShareAppMessage 是async函數(shù)，分享時(shí)會(huì)調(diào)用這個(gè)方法，但是分享的事件是走的默認(rèn)的分享，沒(méi)用使用我return的參數(shù)對(duì)象。Promise同理。

而且return的對(duì)象寫(xiě)到請(qǐng)求方法里面也會(huì)出現(xiàn)上面的問(wèn)題：方法會(huì)被調(diào)用，但是分享事件沒(méi)有用return的參數(shù)。如下：

//分享功能
 onShareAppMessage: function () {
  var that = this;
  util.request(api.CreateShareCode, {
   sharecode: 'itemid/' + that.data.productid + '*fromuser/' + user.getBuyerUserId() + '*shopid/' + that.data.shopId
  }).then(function (res) {

   if (res.statusCode === 0) {
  　　　　var newShareCode = res.sharedata;
  　　　　var shareBackUrl = 'pages/goods/goods&#63;scene=' + newShareCode;
  　　　　return {
   　　　　title: that.data.goods.title,
   　　　　path: shareBackUrl
  　　　　}
   }
  });
 },

jQuery的ajax請(qǐng)求可以這么設(shè)置同步請(qǐng)求：

$.ajaxSetup({
  async: false
});

async 方法，別人調(diào)用的時(shí)候，會(huì)立刻返回一個(gè)Promise，而return里的path，則是在返回的那個(gè)getShareCode里獲取的。微信調(diào)用這個(gè)方法拿的是返回值，也就是一個(gè)Promise，而Promise里沒(méi)有他需要的那些參數(shù)，所以就是默認(rèn)的分享了。
換句話說(shuō)，這個(gè)Share回調(diào)不允許有異步操作。能改成同步就改，不能改的話，就得改代碼邏輯了。

結(jié)果發(fā)現(xiàn)這個(gè)Share回調(diào)還真不允許有異步操作。

曲線救國(guó)的方法就多了，比如：

1、在頁(yè)面加載的時(shí)候先請(qǐng)求好數(shù)據(jù)，存在data里

2、寫(xiě)個(gè)阻塞的函數(shù)

3、封裝自己的分享函數(shù)onShareAppMessage實(shí)現(xiàn)分享參數(shù)的動(dòng)態(tài)獲取

看完這篇關(guān)于小程序如何分享鏈接onShareAppMessage的文章，如果覺(jué)得文章內(nèi)容寫(xiě)得不錯(cuò)的話，可以把它分享出去給更多人看到。

向AI問(wèn)一下細(xì)節(jié)

小程序如何分享鏈接onShareAppMessage

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽