vue下实现复制功能--插件版

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/Tomhs3000/article/details/80854679

之前介绍了不使用插件的复制方法,现在在介绍一下使用插件的复制方法。

一、安装

$ npm install vue-clipboard

二、引入

var VueClipboard = require('vue-clipboard')
 
Vue.use(VueClipboard)
 
new Vue({
  data: {
    copyData: 'copy data'
  },
})

三、使用

<button v-clipboard:copy="copyData">Copy</button>

四、回调

将上方代码改为

<span 
  class="copytext"                
  type="button" 
  v-clipboard:copy="copyData"
  v-clipboard:success="onCopy"
  v-clipboard:error="onError">
  Copy
</span>
其中onCopy和onError分别是成功和失败的回调,方法写在methods里

猜你喜欢

转载自blog.csdn.net/Tomhs3000/article/details/80854679