Vue项目中使用‘复制’按钮

大纲

1.安装依赖
2.main.js中引入
3.使用

1.安装

npm install --save v-clipboard

2.main.js中引入

import Vue from 'vue'
import Clipboard from 'v-clipboard'
Vue.use(Clipboard)

3.使用

template

<button v-clipboard="value"
        v-clipboard:success="onCopySuccess" 
        v-clipboard:error="onCopyError">点击复制</button>

data

data () {
  return {
    value:'复制数据'
  }
},

methods

onCopySuccess() {
 this.$message.success("复制成功");
},
onCopyError() {
  this.$message.error("复制失败");
},

结束。

posted @ 2022-12-06 22:17  轻风细雨_林木木  阅读(83)  评论(0编辑  收藏  举报