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

2024-01-07 21:38:19

源码如下

? 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('复制成功')

文章来源:https://blog.csdn.net/2301_77742545/article/details/135436025
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。