VUE3的学习和使用（三）用execCommand实现文本复制

💥 利用execCommand复制文本

<template>
<button  @click="copyText">复制</button>

<section id="copy-text">
    ...
</section>
</template>

// 复制监测详情内容
const copyText = () => {
  // 获取需要复制的元素以及元素内的文本内容
  const container = document.getElementById('copy-text');
  const text = container.innerText;
  // 添加一个input元素放置需要的文本内容
  const copyContent= document.createElement('input');
  copyContent.value = text;
  document.body.appendChild(copyContent);
  // 选中并复制文本到剪切板
  copyContent.select();
  document.execCommand('copy');
  // 移除input元素
  document.body.removeChild(copyContent);
  console.log('复制成功');
};

需要注意的是，复制的文本不会换行。
后来又要求复制的文本以固定格式输出，没有办法只能硬写,取到各种需要的数据拼接成字符串。（我是笨比，不知道有啥更好的方法😭）

©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容