vue-clipboard2实现点击复制

npm install --save vue-clipboard2

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

<template>
  <div>
    <input type="text" v-model="message" />
    <button
      type="button"
      v-clipboard:copy="message"
      v-clipboard:success="onCopy"
      v-clipboard:error="onError"
    >Copy!</button>
  </div>
</template>
<script>
export default {
  data() {
    return {
      message: ""
    };
  },
  methods: {
    onCopy: function(e) {
      alert("You just copied: " + e.text);
    },
    onError: function(e) {
      alert("Failed to copy texts");
    }
  }
};
</script>

<template>
  <div>
    <input type="text" v-model="message" />
    <button type="button" @click="doCopy">Copy!</button>
  </div>
</template>
<script>
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");
        }
      );
    }
  }
};
</script>