vue 实现button点击复制链接

使用的是 vue-clipboard2npm 包,配合button按钮,实现点击复制链接功能

下载安装npm包

yarn add vue-clipboard2
// 或
npm install vue-clipboard2 --save-dev

配置npm包

在项目的main.js文件导入并配置

import VueClipboard from 'vue-clipboard2'
VueClipboard.config.autoSetContainer = true; // add this line
Vue.use(VueClipboard);

在项目中button组件中使用

<el-button
  type="text"
  v-if="scope.row.op_status === 2"
  v-clipboard:copy="scope.row.copyMessage"
  v-clipboard:success="onCopy"
  v-clipboard:error="onError"
  >复制链接</el-button
>

v-clipboard:copy = 要复制的内容
v-clipboard:success = 复制成功回调
v-clipboard:error = 复制失败回调

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容