vue-reactive-clipboard
A minisize vue2/3 reactive clipboard
Install
Install with yarn:
$ yarn add vue-reactive-clipboard
Install with npm:
$ npm i vue-reactive-clipboard –save
Usage
Vue3
<template>
<p @click=”copy(content)”> {{ content }} </p>
</template>
<script setup lang=”ts”>
import { ref, watchEffect } from ‘vue’
import { useClipboard } from ‘vue-reactive-clipboard’
const { text, copy } = useClipboard()
const content = ref(‘click me to copy!’)
watchEffect(() => {
if (text.value) {
console.log(‘copy successed: ‘ + text.value)
}
})
</script>
Vue2
Install @vue/composition-api as a dependency.
<template>
<div>
<p @click=”copy(content)”> {{ content }} </p>
</div>
</template>
<script>
import { ref, watchEffect, defineComponent } from ‘@vue/composition-api’
import { useClipboard } from ‘vue-reactive-clipboard’
export default defineComponent({
setup () {
const { text, copy } = useClipboard()
const content = ref(‘click me to copy!’)
watchEffect(() => {
if (text.value) {
console.log(‘copy successed: ‘ + text.value)
}
})
return {
content,
copy
}
}
})
</script>
GitHub
