通过clipboard实现参数的复制

npm install clipboard

先安装clipboard

<template>
  <div>
    <div v-for="item in list" :key="item.id">
      //data-clipboard-text作为当前点击需要复制的内容
      <div class="btn" @click="copyId" :data-clipboard-text="item.id">复制</div>
    </div>
  </div>
</template>
<script>
import Clipboard from 'clipboard'
export default {
  data(){
    return {
      list:[{id:1},{id:2}]
    }
  }
  methods:{
    copyId(){
        //绑定btn按钮
        let clipboard = new Clipboard('.btn');
        clipboard.on('sucess',()=>{
             console.log('copy sucess');
             clipboard.destroy()
        })
        clipboard.on('error',()=>{
             console.log('copy error');
             clipboard.destroy()
        })
    }
  }
}
</script>
posted @   zeal666  阅读(113)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构
· 提示词工程——AI应用必不可少的技术
· 字符编码:从基础到乱码解决
· 地球OL攻略 —— 某应届生求职总结
点击右上角即可分享
微信分享提示