Vue点击复制到剪切板

本文主要是介绍Vue点击复制到剪切板，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

一、Vue2写法

安装 （官网地址）

npm install --save vue-clipboard2

使用

//main.js
import VueClipboard from 'vue-clipboard2'
Vue.use(VueClipboard)//页面使用
<button type="button"v-clipboard:copy="message"v-clipboard:success="onCopy"v-clipboard:error="onError">Copy!</button>

二、Vue3写法

安装 （官网地址）

npm install --save vue-clipboard3

or

yarn add vue-clipboard3

使用 

//引入
import useClipboard from 'vue-clipboard3'
const { toClipboard } = useClipboard()//使用
const copy = async () => {try {await toClipboard(location.href)console.log('Copied to clipboard')} catch (e) {console.error(e)}
}

这篇关于Vue点击复制到剪切板的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！