在自己想要复制的内容所在标签上添加一个类名和一个点击事件方法,方法需传入你想复制的值。
<font class="text-copy" @click.stop="_copy(todo.title)">{{ todo.title }}</font>
若只想点击复制按钮时实现复制功能,不想点击文本内容也能复制则可将类名和点击事件都给另外一个标签。
<font>{{ todo.title }}</font><span class="text-copy" @click.stop="_copy(todo.title)"><span>
methods: {
// 复制操作
_copy(context) {
// 创建输入框元素
let oInput = document.createElement('input');
// 将想要复制的值
oInput.value = context;
// 页面底部追加输入框
document.body.appendChild(oInput);
// 选中输入框
oInput.select();
// 执行浏览器复制命令
document.execCommand('Copy');
// 弹出复制成功信息
this.$message.success('复制成功');
// 复制后移除输入框
oInput.remove();
}
}