1撮躁、引入clipboard.js,方法如下:
第一種直接npm安裝:npm install clipboard --save
第二種:(下載地址:https://clipboardjs.com/)
2买雾、在需要使用的組件中import
引用方法:import Clipboard from 'clipboard';
3把曼、添加需要復(fù)制的內(nèi)容
例如:<button class="tag-read" data-clipboard-text="需要復(fù)制的內(nèi)容" @click="copy">立即閱讀</button>
如果是data中的內(nèi)容杨帽,則用?:data-clipboard-text="name",就像input 中使用:value="name"一樣
解析: data-clipboard-text 后邊跟需要復(fù)制的內(nèi)容
4嗤军、添加點(diǎn)擊后的方法
copy() {
? var clipboard = new Clipboard('.tag-read')
? clipboard.on('success', e => {
? console.log('復(fù)制成功')
? // 釋放內(nèi)存
? clipboard.destroy()
? })
? clipboard.on('error', e => {
? // 不支持復(fù)制
? console.log('該瀏覽器不支持自動(dòng)復(fù)制')
? // 釋放內(nèi)存
? clipboard.destroy()
? })
? }
轉(zhuǎn)載自https://www.jb51.net/article/173902.htm