关于web复制组件 Clipboard（vue框架下）_综合

组件常用于web页的内容复制业务，原理是复制进剪切板内，使web页面上的内容能复制至web以外的软件上

1、安装组件

npm install clipboard --save

2、加载组件

import Clipboard from 'clipboard'

3、编写复制事件（.copybtn为绑定该事件按钮的类名）

copy() {let clipboard = new Clipboard('.copybtn')clipboard.on('success', e => {console.log('复制成功')clipboard.destroy()})clipboard.on('error', e => {
    console.log('复制失败')clipboard.destroy()})
}

4、绑定复制事件（此处使用vue和mintUI库，其他类似）

<span>{
    {cardMsg.toName}}</span>
<mt-button class="copybtn" size="small" plain type="primary" :data-clipboard-text="cardMsg.toName" @click="copy">复制</mt-button>