vue实现点击复制功能方法封装demo。

源码如下

? copyTextToClipboard(text, that) {

? ? ? ? const textArea = document.createElement("textarea");

? ? ? ? textArea.value = text;

? ? ? ? document.body.appendChild(textArea);? ? ?在子节点末尾添加元素

? ? ? ? textArea.select();? ? ? select方法讲解可以了解一下?? ? ? ? JavaScript select()方法_js select()-CSDN博客??

? ? ? ? 简单来说select() 方法就是获取要复制的值。

? ? ? ? document.execCommand("copy")?

? ? ? ? 浏览器本身提供了一个copy命令，利用它可以复制选中(select方法)的内容

? ? ? ? document.body.removeChild(textArea);? ?删除子节点元素

? ? ? ? console.log('复制成功', text)

? ? ? ? that.$notify({

? ? ? ? ? ? title: '成功',

? ? ? ? ? ? message: '复制成功',

? ? ? ? ? ? type: 'success',

? ? ? ? })

? ? },

如何使用

1.导入该方法

2.方法需要两个参数? ? ?参数一：需要复制的内容? ? 参数二：that

3.that.$notify 方法是在右侧提示是否复制成功提示的。如果想在顶部居中提示可以

改为? ? that.$message.success('复制成功')