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('抱歉,复制失败!')
},
}
本文来自博客园,作者:GoodTimeGGB,转载请注明原文链接:https://www.cnblogs.com/goodtimeggb/p/17046236.html