通过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 @ 2022-05-24 10:55  zeal666  阅读(124)  评论(0)    收藏  举报