vue 实现复制粘贴功能
vue 实现复制粘贴功能
这里使用到的是vue-clipboards插件，
首先安装依赖 yarn add vue-clipboards -s
然后引入项目main.js文件中，注册使用 import VueClipboards from “vue-clipboards”; Vue.use(VueClipboards)
就可以直接在页面上使用：
<template>
<div>
<span>{
{
copyText}}</span>
<button v-clipboard="copyText" @success="handleCopy" @error="handleCopyFail">复制</button>
</div>
</template>
<script>
export default {
name: "page",
data() {
return {
copyText: "想要复制的文本"
};
},
methods: {
// 复制成功回调
handleCopy() {
this.$toast("复制成功"); // ui组件使用的是vant
}
// 复制失败回调
handleCopyFail(){
this.$toast("复制失败");
}
}
};
</script>
上一篇：
IDEA上Java项目控制台中文乱码