先上需要的效果图哈

如图所示，再vue项目中，分享携带头部标题、简介和缩略图等信息，下面进入正题：

安装&引入

// 再index.html中放入
    <script src="https://res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script>

或者使用官方插件

npm i weixin-js-sdk

使用（再需要引用的页面）

// npm安装的需要引入
let wx = require('weixin-js-sdk');

// 再mounted中调用该方法
getShareInfo() {
	// 调用后端接口 请求appId、签名等信息
      axios.get('https://test.site/api/v1/shop/js-sdk', {
        params:{ url: this.url }
        }
        ).then(res => {
          const { appId, nonceStr, rawString, signature, timestamp} = res.data.data
          // 微信分享授权
          wx.config({
            debug: false,// 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出
            appId,         // 必填，公众号的唯一标识，填自己的！
            timestamp, // 必填，生成签名的时间戳，刚才接口拿到的数据
            nonceStr,   // 必填，生成签名的随机串
            rawString,
            signature, // 必填，签名，见附录1
            jsApiList: [ // 需要使用的JS接口列表
              'onMenuShareTimeline',
              'onMenuShareAppMessage',
              'updateTimelineShareData',
              'updateAppMessageShareData'
            ]
            
          })
        })
        

        wx.ready(function () {
            // 分享到朋友圈
            wx.onMenuShareTimeline({ 
              title: '分享标题666', // 分享标题
              link: 'https://test-2021.com/', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
              imgUrl: 'https://test.png', // 分享图标
              success: function () {
                // 设置成功
                console.log("分享成功");
              }
            })
            //分享给朋友
            wx.onMenuShareAppMessage({
              title: '分享标题666',
              desc: '分享简介999', 
              link: 'https://test-2021.com/',
              imgUrl: 'https://test.png',
              success: function () {
                console.log("分享成功");
              },
              cancel: function () {
                console.log("取消分享");
              }
            });
        })

    }

其他详细信息可以查看微信开放文档