vue 移动端开发实现点击复制(clipboard)
1 引入模板clipboard官网:https://www.npmjs.com/package/vue-clipboard#installationnpm install clipboard --save2 使用的地方引入引包import Clipboard from 'clipboard'HTML<divclass="code":data-clipboar...
·
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()
})
},
Tips:【小程序云开发】中高级前端面试题库(源码:小程序中联系我哟)。
---------- 创作不易,感谢大家,请多多支持!
更多推荐
已为社区贡献16条内容
所有评论(0)