vue复制文本v-clipboard

复制文本

v-clipboard可以用在任何静态或动态元素上。当元素被点击时，指令的值会被复制到剪贴板上

 

npm install --save v-clipboard

import Vue from 'vue'
import Clipboard from 'v-clipboard'

Vue.use(Clipboard)

<template>
  <div>
    <p class="margin-10">指令：复制文本</p>
    <div class="margin-10">
      <button v-clipboard="value" v-clipboard:success="handleSuccess" v-clipboard:error="handleError">按钮</button>
    </div>
  </div>
</template>

<script>
export default {
  name: "idea",
  data() {
    return {
      value: "指令：复制文本",
    };
  },
  methods: {
    handleSuccess() { //成功
      console.log("success", this.value);
    },
    handleError() { //失败
      console.log("error", this.value);
    }
  },
};
</script>

<style lang="scss" scoped>
.margin-10 {
  margin: 10px;
}
</style>