关于vue.js:vue的复制粘贴-clipboardjs

5次阅读

共计 617 个字符，预计需要花费 2 分钟才能阅读完成。

点击复制性能次要通过 clipboard.js 来实现

1、引入 clipboard.js，办法如下：

第一种间接 npm 装置：npm install clipboard –save

第二种：<script src=”js/clipboard.min.js”></script>（下载地址：https://clipboardjs.com/）

2、在须要应用的组件中 import

援用办法：import Clipboard from ‘clipboard’;

components: {Clipboard},

3、增加须要复制的内容

例如：<button class=”tag-read” data-clipboard-text=” 我是能够复制的内容，请点击复制 ” @click=”copy”> 立刻浏览 </button>

解析：data-clipboard-text 后边跟须要复制的内容

4、增加点击后的办法

copy(index){var clipboard = new Clipboard('.copyStr'+index);
  clipboard.on('success', e => {this.$message.success("复制胜利");
    // 开释内存
    clipboard.destroy()})
  clipboard.on('error', e => {
    // 不反对复制
    this.$message.warning("该浏览器不反对主动复制");
    // 开释内存
    clipboard.destroy()})
},

正文完