vue 微信H5分享 代码

以下是Vue微信H5分享的代码示例：

export default {
  data() {
    return {
      shareTitle: '分享标题',
      shareDesc: '分享描述',
      shareLink: window.location.href,
      shareImgUrl: '分享图标url'
    }
  },
  mounted() {
    this.initWechatShare()
  },
  methods: {
    initWechatShare() {
      // 引入微信JS-SDK
      const wx = require('weixin-js-sdk')
      const url = window.location.href.split('#')[0]
      const data = {
        url
      }
      // 向后端请求签名数据
      axios.get('/api/wechat/signature', { params: data }).then(res => {
        if (res.data.code === 0) {
          const signatureData = res.data.data
          wx.config({
            debug: false,
            appId: signatureData.appId,
            timestamp: signatureData.timestamp,
            nonceStr: signatureData.nonceStr,
            signature: signatureData.signature,
            jsApiList: [
              'updateAppMessageShareData',
              'updateTimelineShareData'
            ]
          })
          wx.ready(() => {
            // 分享到朋友圈
            wx.updateTimelineShareData({
              title: this.shareTitle, // 分享标题
              link: this.shareLink, // 分享链接
              imgUrl: this.shareImgUrl, // 分享图标
              success() {
                // 分享成功回调
              }
            })
            // 分享给朋友
            wx.updateAppMessageShareData({
              title: this.shareTitle, // 分享标题
              desc: this.shareDesc, // 分享描述
              link: this.shareLink, // 分享链接
              imgUrl: this.shareImgUrl, // 分享图标
              type: '', // 分享类型,music、video或link，不填默认为link
              dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
              success() {
                // 分享成功回调
              }
            })
          })
        }
      })
    }
  }
}

在以上代码中，我们使用 axios 向后端请求签名数据，获取 appId、timestamp、nonceStr 和 signature 等信息，然后使用微信 JS-SDK 进行配置和分享。分享到朋友圈使用的接口是 `wx.updateTimelineShareData`，分享给朋友使用的接口是 `wx.updateAppMessageShareData`。

注意，以上代码仅供参考，实际使用需要根据自己的情况进行修改。