Vue.js Clipboard plugin

(No dependencies, less than 2kb minified)

Install

npm install --save v-clipboard
Bash
import Vue       from 'vue'
import Clipboard from 'v-clipboard'

Vue.use(Clipboard)
JavaScript

Use

There are 2 ways of using this plugin:

  1. Using v-clipboard="mymodel" directive.

When an element that contains v-clipboard directive is clicked, the value of mymodel will be copied into clipboard.

  1. Using this.$clipboard(value) function.

This one is simple :-)

Examples

Option 1: Using template only.

<input v-model="foo">

<button v-clipboard="foo">
  Copy to clipboard
</button>
Vue

Option 2: Using javascript call.

<button @click="copy">
  Copy to clipboard
</button>
Vue
methods: {
  copy () {
    this.$clipboard("Baaaaaaaaar")
  }
}
JavaScript

Events

<button v-clipboard="foo"
        @copy="clipboardSuccessHandler"      // Success event handler 
        @copy-error="clipboardErrorHandler"> // Error event handler
  Copy to clipboard
</button>
Vue

GitHub

euvl/v-clipboard

??

— Read More

Download as zip