vue + element-ui + vue-clipboard2 实现文字复制粘贴功能与提示

本文主要是介绍vue + element-ui + vue-clipboard2 实现文字复制粘贴功能与提示，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

1、在所在项目下安装插件

npm install vue-clipboard2 --save

2、在所在项目的index.js注入vue-clipboard2

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

3、使用

<div><el-button size="mini" type="primary" icon="el-icon-copy-document" round class="copy-btn" v-clipboard:copy="要复制的文本内容的值" v-clipboard:success="onCopy" v-clipboard:error="onError">复制</el-button>
</div>

回调函数

methods: {// 复制成功时的回调函数onCopy (e) {this.$message.success('内容已复制到剪切板！')},// 复制失败时的回调函数onError (e) {this.$message.error('抱歉，复制失败！')},
}

这篇关于vue + element-ui + vue-clipboard2 实现文字复制粘贴功能与提示的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---