Vue项目配置微信分享

// index.html
<script src="http://res.wx.qq.com/open/js/jweixin-1.6.0.js">script>

// assets => js => 新建 wxshare.js
export function wxShare ({title, desc, link, imgUrl,success}) {
  let wxShare = {
    title: title || ‘默认标题‘, // 分享标题
    desc: desc || ‘默认分享文案‘, // 分享描述
    link: link || window.location.href, // 分享链接
    imgUrl: imgUrl || ‘https://cn.vuejs.org/images/logo.png‘, // 分享图标
    success: function () {
      // 用户点击了分享后执行的回调函数
      success && success()
    }
  }
  wx.ready(() => {   //需在用户可能点击分享按钮前就先调用
    // 自定义“分享给朋友”及“分享到QQ”按钮的分享内容
    // wx.updateAppMessageShareData(wxShare)
    // 自定义“分享到朋友圈”及“分享到qq空间”
    // wx.updateTimelineShareData(wxShare)

    // 以上新分享方法的成功回调不是转发成功回调，而是自定义内容成功回调
    //获取“分享给朋友”按钮点击状态及自定义分享内容接口（即将废弃）
    wx.onMenuShareAppMessage(wxShare);
    //获取“分享到朋友圈”按钮点击状态及自定义分享内容接口（即将废弃）
    wx.onMenuShareTimeline(wxShare);
  })
  wx.error(res => {
    // config信息验证失败会执行error函数
    console.log(res)
  })
}

// app.vue
 created(){
    this.wxShareConfig();
  },
  methods: {
    //配置微信转发
    wxShareConfig(){
      // 方便从接口中获取配置参数
      let appId = "wx7f963082054fe371";
      let nonceStr = "JrLvVC3ygqSlcBnc";
      let signature = "66c459474ebbea661b38be92149c5f60d91d05ed";
      let timestamp = "1592445883";
      // 配置信息
      wx.config({
        debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
        appId: appId, // 必填，公众号的唯一标识
        timestamp: timestamp, // 必填，生成签名的时间戳
        nonceStr: nonceStr, // 必填，生成签名的随机串
        signature: signature,// 必填，签名
        jsApiList: [‘onMenuShareAppMessage‘,‘onMenuShareTimeline‘] // 必填，需要使用的JS接口列表
      })
    }
  }