首先以分享給朋友為例

1、先看官方文檔

wx.onMenuShareAppMessage({  title: '', // 分享標題  desc: '', // 分享描述  link: '', // 分享鏈接，該鏈接域名或路徑必須與當前頁面對應的公眾號JS安全域名一致  imgUrl: '', // 分享圖標  type: '', // 分享類型,music、video或link，不填默認為link  dataUrl: '', // 如果type是music或video，則要提供數據鏈接，默認為空  success: function () {    // 用戶確認分享后執行的回調函數  },  cancel: function () {    // 用戶取消分享后執行的回調函數  }});

2、vue分享踩的坑

* 1、微信分享中獲取動態的url
* 2、 微信二次分享自動添加的參數     form=singlemessage
* 3、vue中各個頁面都可以調用分享

3、直接代碼分析

為了保證每個頁面都可以調起微信分享,需要在vue根組件中,添加 watch監聽

代碼

watch: {    // 監聽 $route 變化調用分享鏈接    "$route"(to, from) {      let currentRouter = this.$router.currentRoute.fullPath;  //      if(currentRouter.indexOf('userShare') == -1){   //如果不是userShare分享頁面,則分享另外一個接口        this.shareOut();      }else{        this.shareOutTwo();     //當前頁面是userShare頁面時分享調用另外一個接口         }    }  },

4、shareOut()函數

      let signStr = '';      //sha1加密字符串      let timestamp = 1473254558; //時間戳      let nonceStr = 'shupao';      var obj = {        title:"",        //標題        desc:"文字描述",     //描述        link:"http://www.XXXXXX.com/wx/pub/sr/simpleRegister.do",        imgUrl:"http://XXXXXXXXX.com/picactive.jpg"      };      this.$ydkAjax({        SENTYPE: "GET",        url: this.$domain + '/wx/pub/common/getJsApiTicket.json', //自己服務器獲取jsapi_ticket接口        params: null,        successFc: (response) => {          //拼接sha1加密字符串          signStr = 'jsapi_ticket=' + response.data.data + '&noncestr=' + nonceStr + '×tamp=' + timestamp + '&url=' + window.location.href;          var signature = SHA1(signStr);          wx.config({            debug: false,            appId: "wx6957b3a945a05e90",   //appId            timestamp: timestamp,      //時間戳            nonceStr: nonceStr,       //加密需要字符串(自己定義的)                signature: signature,      //sha1加密后字符串            jsApiList: [ 'onMenuShareTimeline', 'onMenuShareAppMessage']          });          wx.ready(function () {            //分享到朋友圈"            wx.onMenuShareTimeline({              title: obj.title,              link: obj.link, // 分享鏈接              imgUrl: obj.imgUrl, // 分享圖標              success: function () {                // console.log('分享到朋友圈成功')              },              cancel: function () {                // console.log('分享到朋友圈失敗')              }            });            //分享給朋友            wx.onMenuShareAppMessage({              title: obj.title, // 分享標題              desc: obj.desc, // 分享描述              link: obj.link, // 分享鏈接              imgUrl: obj.imgUrl, // 分享圖標              success: function () {                // console.log('分享到朋友成功')              },              cancel: function () {                // console.log('分享到朋友失敗')              }            });          })        },        isLayer: false      })