安装依赖包:
npm install clipboard --save
在需要用到的vue文件导入:
import Clipboard from 'clipboard';
import { Toast } from 'vant'; //引入vant ui库的toast轻提示
<div class="id-item item">
<span>单号</span>
<p class="order-id" :data-clipboard-text="item.orderID" @click="copyID">{{ item.orderID }} 复制</p>
</div>
//复制功能
copyID () {
var clipboard = new Clipboard('.order-id') //绑定数据标签的类名
clipboard.on('success', e => {
console.log('复制成功', e)
Toast.success('复制成功');
// 释放内存
clipboard.destroy()
})
clipboard.on('error', e => {
Toast.fail('该浏览器或手机权限不支持复制功能');
// 释放内存
clipboard.destroy()
})
},