clipboard.js vue使用

clipboard.js vue使用

js复制方案

1.安装

npm install clipboard --save

官网  https://clipboardjs.com/

2.demo

<template>

          <div>

            <span>{{ msg}}</span>

            <button class="btn-cli" :data-clipboard-text="msg" @click="copyMsg">点击复制</button>

          </div>

</template>

<script>

//引用组件

import Clipboard from 'clipboard'

export default {

data(){

return {

msg:'要复制的内容',

}

}

components: {

    Clipboard

  },

methods:{

    copyMsg(){

//className  点击按钮的 class .btn-cli

        const clipboard = new Clipboard(".btn-cli")

          clipboard.on('success', e => {

          //释放内存

            clipboard.destroy()

          })

         clipboard.on('error', e => {

         //释放内存

           clipboard.destroy()

         })


    }

}

}


</script>

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

推荐阅读更多精彩内容