第一步
npm install clipboard --save
第二步
// 页面中引入
import Clipboard from "clipboard";
第三步
<el-table-column label="邀请链接" align="center">
<template #default="scope">
<span :id="'copyBody' + scope.row.id">
{{
"https://wkzx.wang/invitation/" + scope.row.inviteCode
}}</span
>
<br />
<span
class="copy_obj"
@click="copy"
data-clipboard-action="copy"
:data-clipboard-target="'#copyBody' + scope.row.id"
>复制</span
>
</template>
</el-table-column>
第四步
// 复制
copy() {
let clipboard = new Clipboard(".copy_obj");
clipboard.on("success", (e) => {
console.log(e);
clipboard.destroy();
return this.$message.success("复制成功");
});
clipboard.on("error", (e) => {
console.log(e);
// 不支持复制
clipboard.destroy();
return this.$message.error("该浏览器不支持复制");
});
},