vue-clipboard2实现点击复制

文档： https://www.npmjs.com/package/vue-clipboard2

安装

npm install --save vue-clipboard2

使用

main.js

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

示例1

demo1.vue

  
    

    Copy!
  

 

export default {
  data() {
    return {
      message: ""
    };
  },

  methods: {
    onCopy: function(e) {
      alert("You just copied: " + e.text);
    },

    onError: function(e) {
      alert("Failed to copy texts");
    }
  }
};
 

示例2

demo2.vue

  
    

    Copy!
  

 

export default {
  data: function() {
    return {
      message: "Copy These Text"
    };
  },

  methods: {
    doCopy() {
      this.$copyText(this.message).then(
        res => {
          alert("Copied" + res.text);
        },
        err => {
          alert("Can not copy");
        }
      );
    }
  }
};
 

在线Demo: https://mouday.github.io/vue-element-admin-demo/