vue+element 项目使用复制功能

安装 vue-clipboard2

npm install  vue-clipboard2  --save

main.js

import VueClipboard from 'vue-clipboard2'
Vue.use(VueClipboard)

使用

<span @click="copyArticleUrl(scope.row,scope.$index)">
    {{scope.row.articleUrl}}
</span>

copyArticleUrl(row,index){
    let  _this = this;
       //row.articleUrl  要复制的内容
    this.$copyText(row.articleUrl).then(function (e) {
           _this.$message.success('复制成功')
    }, function (e) {
          _this.$message.error('复制失败,请手动复制')
    })
},

// v-clipboard:copy="scope.row.articleUrl" 对要复制的内容进行赋值
<span  v-clipboard:copy="scope.row.articleUrl"
           v-clipboard:success="onCopySuccess"
           v-clipboard:error="onCopyError">
    {{scope.row.articleUrl}}
</span>
onCopySuccess(e){
     this.$message.success('复制成功')
},
onCopyError(e){
     this.$message.error('复制失败,请手动复制')
},

转载于https://github.com/Inndy/vue-clipboard2