Thanks to v-clipboard for inspiration!
If you want to support Vue 2.x, please use v-clipboard v2.x.
npm install --save v3-clipboard
import { createApp } from 'vue'
import Clipboard from 'v3-clipboard'
const app = createApp(App)
app.use(Clipboard)
app.mount('#app')
When an element that contains
v-clipboard
directive is clicked, the value ofvalue
will be copied into clipboard.
Copying static value (directive should receive actual value):
<button v-clipboard="value">
Copy to clipboard
</button>
Copying dynamic value (directive should recieve a function that returns value):
<button v-clipboard="() => value">
Copy to clipboard
</button>
Copying anything in your methods:
this.$clipboard(value)
<button v-clipboard="foo"
v-clipboard:success="clipboardSuccessHandler" // Success event handler
v-clipboard:error="clipboardErrorHandler"> // Error event handler
Copy to clipboard
</button>
{
methods: {
clipboardSuccessHandler ({ value, event }) {
console.log('success', value)
},
clipboardErrorHandler ({ value, event }) {
console.log('error', value)
}
}
}