vuejs实现一键复制功能

1，首先安装插件：

npm install clipboard --sava

2，在组件中应用 

import Clipboard from 'clipboard'

3，clipboard的实际使用

 1 <!--第一种直接绑定在按钮上-->
 2  <button class="marleft10 btn" style="float: right;border: none;" :data-clipboard-text="2"
 3         @click="copy()">复制
 4         </button>
 5 <!--第二种单个复制按钮动态获取需要复制的内容-->
 6 <input type="text" v-model="copyContent"  id="copy_text" style="opacity: 0">
 7 <button ref="copy"  data-clipboard-action="copy" data-clipboard-target="#copy_text" @click="copy">复制</button>
 8 <!--第三种可以在New Clipboard时设定要复制的内容-->
 9 new Clipboard('copyBtn',function(){
10     return <!--要复制的内容-->
11 })
12 
13 copy(){
14     let _this = this
15     <!--如果在内部new会出现点击两次在复制成功的现象所以还请各位多多注意-->
16     clipboard.on('success', function () {
17         Toast('复制成功')
18         _this.destroy() <!--销毁缓存,然后在重新new这样不会出现点击复制上出现之前复制的内容的情况-->
19         _this.clipboard = new Clipboard(copyBtn);
20     })
21     clipboard.on('error', function () {
22         Toast('复制失败，请手动复制')
23       })
24     }