vue3 按钮复制粘贴功能

1.html

<div  @click="copy(item.envelopePassword)" >  复制口令  </div>

2.utils 创建copy.js

export const copy = (val: string): void => {
  let { isSuccessRef } = useCopyToClipboard(val) as any
  if (isSuccessRef) {
    // 轻提示
    showNotify("复制成功");
  } else {
    showNotify("复制失败");
  }
}


const useCopyToClipboard = (val: string) => {
  let isSuccessRef = false;
  //创建input标签
  var input = document.createElement("input");
  //将input的值设置为需要复制的内容
  input.value = val;
  //添加input标签
  document.body.appendChild(input);
  //选中input标签
  input.select();
  //执行复制
  document.execCommand("copy");
  if (document.execCommand("copy")) {
    isSuccessRef = true;
  } else {
    isSuccessRef = false;
  }
  //移除input标签
  document.body.removeChild(input);
  return { isSuccessRef };
}

3.页面用用

import { copy } from '@/utils/copy'

上一篇:【车载开发系列】常见单片机调试接口的区别