1 引入模板clipboard
官网: https://www.npmjs.com/package/vue-clipboard#installation
npm install clipboard --save
2 使用的地方引入
引包
import Clipboard from 'clipboard'
HTML
<div class="code" :data-clipboard-text="userInfo.account" @click="copy">
<div>{{userInfo.account}}</div>
<div>(点击复制)</div>
</div>
方法
/**
* 复制功能
*/
copy () {
var clipboard = new Clipboard('.code')
clipboard.on('success', e => {
console.log('复制成功', e)
Toast({
message: '复制成功'
})
// 释放内存
clipboard.destroy()
})
clipboard.on('error', e => {
// 不支持复制
Toast({
message: '手机权限不支持复制功能'
})
console.log('该浏览器不支持自动复制')
// 释放内存
clipboard.destroy()
})
},