v-copy 复制到剪贴板的Vue指令
v-copy 复制到剪贴板的Vue指令
JavaScript Vue.js相关
共85Star
详细介绍
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