vue实现微信自带浏览器分享（小卡片形式）

注意：只能在微信自带浏览器打开进行分享
1.图片效果

2.cdn引入weixin-js-sdk的依赖

在index.html中引入

 <script src="https://res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script>

2.在assets/js文件夹中创建share.js文件

import axios from "axios";
import qs from "qs";

let common_share = {
  "imgUrl": 'https://profile-avatar.csdnimg.cn/1fcf9ab0aa7a45e3b5da1d8e667c80c9_oneya1.jpg!1',    // 分享显示的缩略图地址
  "link": "分享地址",    // 分享地址
  "desc": '分享描述',   // 分享描述
  "title": '分享标题',   // 分享标题
};
let backUrl = "域名地址";
let wxMessage = {
  //默认提交地址
  url: backUrl + "/wx/getWxAutoMessage",//获取appid等信息
}

share(common_share);//默认分享

export function share(shareData) {
  if (!shareData) {
    shareData = common_share;
  }
  axios({
    url: wxMessage.url,
    method: "post",
    data: qs.stringify({ "url": window.location.href }),
    headers: {
      'Content-Type': 'application/x-www-form-urlencoded'
    }

  })
    .then(function (res) {
      var resultData = res.data.data;
      wx.config({
        debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
        appId: resultData.appId, // 必填，公众号的唯一标识
        timestamp: resultData.timestamp, // 必填，生成签名的时间戳
        nonceStr: resultData.nonceStr, // 必填，生成签名的随机串
        signature: resultData.signature,// 必填，签名，见附录1
        jsApiList: [// 必填，需要使用的JS接口列表，所有JS接口列表见附录2
          'checkJsApi',
          'onMenuShareTimeline',
          'onMenuShareAppMessage',
          'onMenuShareQQ',
          'onMenuShareWeibo',
          'updateAppMessageShareData',
          'hideMenuItems',
          'showMenuItems',
          'hideAllNonBaseMenuItem',
          'showAllNonBaseMenuItem',
          'translateVoice',
          'startRecord',
          'stopRecord',
          'onRecordEnd',
          'playVoice',
          'pauseVoice',
          'stopVoice',
          'uploadVoice',
          'downloadVoice',
          'chooseImage',
          'previewImage',
          'uploadImage',
          'downloadImage',
          'getNetworkType',
          'openLocation',
          'getLocation',
          'hideOptionMenu',
          'showOptionMenu',
          'closeWindow',
          'scanQRCode',
          'chooseWXPay',
          'openProductSpecificView',
          'addCard',
          'chooseCard',
          'openCard'
        ]
      });
    });
  wx.onMenuShareTimeline(shareData);
  wx.onMenuShareAppMessage(shareData);
  wx.onMenuShareQQ(shareData);
  wx.onMenuShareWeibo(shareData);
}