clipboardjs实现点击拷贝复制

不羁的心 提交于 2020-03-08 02:59:24

1、文档
英文:https://clipboardjs.com/
中文http://www.clipboardjs.cn/

2、安装

npm install clipboard --save

3、使用示例
demo.vue

<template>
  <div>
    <input type="text" v-model="message" />

    <button class="btn" :data-clipboard-text="message">Copy</button>
  </div>
</template>
 
<script>
import ClipboardJS from "clipboard";

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

  mounted() {
    // 创建的时候就绑定事件
    var clipboard = new ClipboardJS(".btn");

    clipboard.on("success", function(e) {
      alert(e.text);
      console.log(e);
      e.clearSelection();
    });

    clipboard.on("error", function(e) {
      console.log(e);
    });
  }
};
</script> 
标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!