v-copy

Vue directive to copy to clipboard.

Install

yarn add v-copy

CDN: UNPKG | jsDelivr (It's automatically installed as global directive v-copy in CDN)

Usage

First register the directive globally:

import Copy from 'v-copy'

Vue.use(Copy)

Or locally:

import { copy } from 'v-copy'

export default {
  directives: {
    copy
  }
}

Then use it in template:

<template>
  <button v-copy="`some text`">Copy!</button>
</template>

v-copy:callback: executed after text is copied to clipboard.

<template>
  <button 
    v-copy="`some text`"
    v-copy:callback="handleCopied">Copy!
  </button>
</template>

<script>
export default {
  methods: {
    handleCopied(text) {
      alert(`Copied: ${text}`)
    }
  }
}
</script>

Browser support

This supports what copy-text-to-clipboard supports, namely ever-green browsers and IE9+. (Not all are carefully tested though :P)

License

MIT © EGOIST