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>