vue分享给QQ好友，QQ空间，微博

<script setup lang="ts">
//分享到QQ好友(PC端可用)
//自定义内容
const share = {
  title: '分享测试',
  desc: '测试描述',
  image_url: [
    'https://pic3.zhimg.com/80/v2-ab0718575cc9337b24bfc7578f5e6d32_720w.jpg',
  ],
  share_url: 'https://xiucai.neafex.com/#/',
}
function shareToQQ() {
  //此处分享链接内无法携带图片
  window.open(
    'https://connect.qq.com/widget/shareqq/index.html?url=' +
      encodeURIComponent(share.share_url) +
      '&title=' +
      share.title +
      '&desc=' +
      share.desc
  )
}
//分享到QQ空间(可用)
function shareToRoom() {
  let image_urls = share.image_url.map(function (image) {
    return encodeURIComponent(image)
  })
  //跳转地址
  window.open(
    'https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=' +
      encodeURIComponent(share.share_url) +
      '&title=' +
      share.title +
      '&pics=' +
      image_urls.join('|') +
      '&summary=' +
      share.desc
  )
}
//分享到微博(可用)
function shareToMicroblog() {
  //跳转地址
  window.open(
    'https://service.weibo.com/share/share.php?url=' +
      encodeURIComponent(share.share_url) +
      '&title=' +
      share.title +
      '&pic=' +
      share.image_url +
      '&searchPic=true'
  )
}
</script>

<template>
  <p>欢迎使用</p>
  <div style="margin-top: 100px">
    <button @click="shareToQQ()">分享到QQ</button>
    <button @click="shareToRoom()">分享到QQ空间</button>
    <button @click="shareToMicroblog()">分享到微博</button>
  </div>
</template>