详细介绍：关于ios点击分享自动复制到粘贴板的问题

前言

Android系统没有什么特别的要求，实现这个也比较容易。但ios在某些情况下就会出现问题。

1. 假如ios是点击之后，请求接口，再把接口的内容赋值给粘贴板肯定行不通，会被ios平台拦截，导致赋值失败或者赋值为空。
2. 建议使用第三方库clipboard.js来实现粘贴板赋值
3. 将点击的dom设置为一个button最好实现。

<
!-- 辅助copy的button Android不需要被用户查看 -->
<button id="copy-share" ref="copyBtn" v-show="showBtn">
  Copy to clipboard
  <
  /button>
  import ClipboardJS from 'clipboard'
  ;
  const copyBtn = ref(''
  )
  const showBtn = ref(false
  )
  const handleShareLink =
  async (
  ) =>
  {
  // 这是一个异步函数
  const res =
  await shareLinkGenerate({
  ...
  }
  )
  if(res) {
  copyBtn.value.setAttribute('data-clipboard-text'
  , res)
  ;
  // 并且将这个res的结果，赋值给这个按钮
  var clipboard =
  new ClipboardJS('#copy-share'
  )
  ;
  // 如果请求成功了 让clipboard 和按钮绑定
  clipboard.on('success'
  ,
  function(e
  ) {
  // 成功的回调
  showSuccessToast('分享链接已复制'
  )
  ;
  e.clearSelection(
  )
  ;
  }
  )
  ;
  clipboard.on('error'
  ,
  function(e
  ) {
  // 和失败的回调
  showToast('复制失败'
  )
  ;
  e.clearSelection(
  )
  ;
  }
  )
  ;
  //判断是不是ios系统或者苹果系列
  if (navigator?.userAgent?.match(/(iPhone|iPod|iPad);?/i
  )
  ) {
  // 控制让一个按钮出现，或者弹一个按钮出来，让用户再点击这个按钮一次
  showBtn.value = true
  return
  }
  else {
  // 如果不是苹果，就可以直接赋值给剪贴板了copyBtn 就是对应的按钮
  const handleCopy = (
  ) =>
  {
  if(copyBtn.value) {
  copyBtn.value.click(
  )
  }
  }
  setTimeout((
  ) =>
  {
  handleCopy(
  )
  }
  ,1000
  )
  }
  }
  }