vue 实现点击复制文本

1.引入插件clipboard.js方法如下:
直接npm安装: npm install clipboard --save

2.在需要使用的组件中important
引用方法:important Clipboard from 'clipboard'
3.添加需要复制的内容
例如:

//  data-clipboard-taxt 里面就是我们需要复制的文本
<button class="tag-read" data-clipboard-text="我是可以复制的内容,请点击复制" @click="copy">复制</button>

4.添加点击后的方法

copy () {
   var clipboard = new Clipboard('.tag-read')
   clipboard.on('success', e => {
      console.log('复制成功')
      //  释放内存
     clipboard.destroy()
   })
    clipboard.on('error', e =>{
     // 不支持复制
     console.log('该浏览器不支持复制')
     // 释放内存
     clipboard.destroy()
   })
}

以上就是给大家实现点击复制的方法 大家项目有需求可以试试

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。