当前位置: 代码迷 >> 综合 >> vue移动端点击复制文本内容
  详细解决方案

vue移动端点击复制文本内容

热度:59   发布时间:2024-01-24 16:36:58.0

安装依赖包:

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()})
},

 

  相关解决方案