vue中将文字复制到剪贴板
<template>
<div>
<button @click="copyText">复制文本</button>
<p ref="textToCopy" @click="copyText">这是需要复制的文本</p>
</div>
</template>
<script>
export default {
methods: {
copyText() {
//获取需要复制的文本内容。
const text = this.$refs.textToCopy.innerText;
// 创建一个临时的 textarea 元素。
const el = document.createElement('textarea');
// 将需要复制的文本内容赋值给 textarea 元素。
el.value = text;
//将 textarea 元素添加到页面中。
document.body.appendChild(el);
//选中 textarea 元素中的文本。
el.select();
// 执行复制命令,将选中的文本复制到剪贴板
document.execCommand('copy');
//从页面中移除 textarea 元素。
document.body.removeChild(el);
//弹出提示框,告知用户文本已复制成功。
alert('文本已复制');
},
},
};
</script>