VUE + 微信分享

cnpm i weixin-js-sdk --save

在需要分享的页面引入

import wx from 'weixin-js-sdk'
import { shares } from '@/api/index'; 

在methods写调用的方法

// vue调用微信的自定义分享
    getShareInfo() {
       this.save = {
          url: location.href.split('#')[0] // 只需要传地址就好，其他后端都会写好来
        };
      shares(this.save).then(res => {
        const config = res.data;
        wx.config({
          appId: config.appId,  // appID 公众号的唯一标识
          timestamp: config.timestamp, // 生成签名的时间戳
          nonceStr: config.nonceStr, //  生成签名的随机串
          signature: config.signature, // 生成的签名
          jsApiList: [
            'updateAppMessageShareData',
            'updateTimelineShareData',
            'onMenuShareTimeline',
            'onMenuShareAppMessage',
            'onMenuShareQQ',
            'onMenuShareWeibo',
            'onMenuShareQZone',
          ]
        });
        wx.ready(() => {
          var shareData = {
            title: '王者归来-王者突破特训营',
            desc: '帮助青铜早日登上王者之路',
            link: window.location.href,
            imgUrl:
              '分享出去的图片地址'
          };
          //点击要去分享
          wx.updateAppMessageShareData(shareData);
          wx.updateTimelineShareData(shareData);
          wx.onMenuShareTimeline(shareData);
          wx.onMenuShareAppMessage(shareData);
          wx.onMenuShareQQ(shareData);
          wx.onMenuShareWeibo(shareData);
          wx.onMenuShareQZone(shareData);
        });
      });
    }

在 mounted 中调用分享的方法

 mounted() {
    this.getShareInfo(); // 调用分享的事件
  },