Vue 使用clipboard复制内容到剪切板

安装

npm install clipboard --save

使用

将clipboard封装起来

clipboard.js

import ClipBoard from 'clipboard'
import Vue from 'vue'

function copySuccess() {
  Vue.prototype.$message.success('复制成功!')
}

function copyFailed() {
  Vue.prototype.$message.error('复制失败')
}

/**
 *
 * @param {复制内容} text
 * @param {复制触发对象} event
 */
export function copy(text, event) {
  const clipboard = new ClipBoard(event.target, {
    text: () => text
  })

  clipboard.on('success', () => {
    copySuccess()
    clipboard.destroy()
  })

  clipboard.on('error', () => {
    copyFailed()
    clipboard.destroy()
  })

  clipboard.onClick(event)
}