clipboard在vue中的使用的方法示例

npm install --save clipboard

<template>    <span>{{ code }}</span>    <i    class="el-icon-document"    title="点击复制"    @click="copyActiveCode($event,code )"/></template>// methodscopyActiveCode(e, text) {   const clipboard = new Clipboard(e.target, { text: () => text })   clipboard.on('success', e => {    this.$message({ type: 'success', message: '复制成功' })    // 释放内存    clipboard.off('error')    clipboard.off('success')    clipboard.destroy()   })   clipboard.on('error', e => {    // 不支持复制    this.$message({ type: 'waning', message: '该浏览器不支持自动复制' })    // 释放内存    clipboard.off('error')    clipboard.off('success')    clipboard.destroy()   })   clipboard.onClick(e)  }

<template>    <span>{{ code }}</span>    <i    id="tag-copy" <-- 作为选择器的标识使用用class也行 -->    :data-clipboard-text="code" <-- 这里放要复制的内容 -->    class="el-icon-document"    title="点击复制"    @click="copyActiveCode($event,code)"/></template>// methodscopyActiveCode() {   const clipboard = new Clipboard("#tag-copy")   clipboard.on('success', e => {    this.$message({ type: 'success', message: '复制成功' })    // 释放内存    clipboard.destroy()   })   clipboard.on('error', e => {    // 不支持复制    this.$message({ type: 'waning', message: '该浏览器不支持自动复制' })    // 释放内存    clipboard.destroy()   })  }