vue 复制到粘贴板组件 vue-clipboard2

本文主要是介绍vue 复制到粘贴板组件 vue-clipboard2，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

参考：

https://www.jb51.net/article/160136.htm

https://blog.csdn.net/JackieDYH/article/details/115551105

官网（推荐）：

https://www.npmjs.com/package/vue-clipboard2

安装

npm install --save vue-clipboard2

引入

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

vue文件中使用

<template><div><button type="dashed"v-clipboard:copy="code"v-clipboard:success="copyAddress"v-clipboard:error="copyAddressError">复制内容</button></div>
</template>
<script>
export default {name: "Home",data() {return {code : '20200829-20210324-20210329'};},methods:{// 复制copyAddress(e){console.log(e,"copyAddress");},copyAddressError(e){console.log(e,'copyAddressError');}}
};
</script>

vue文件方法中直接调用

<div id="app"></div><template id="t"><div class="container"><input type="text" v-model="message"><button type="button" @click="doCopy">Copy!</button></div></template><script>new Vue({el: '#app',template: '#t',data: function () {return {message: 'Copy These Text'}},methods: {doCopy: function () {this.$copyText(this.message).then(function (e) {alert('Copied')console.log(e)}, function (e) {alert('Can not copy')console.log(e)})}}})
</script>

这篇关于vue 复制到粘贴板组件 vue-clipboard2的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---