vue 实现剪切板功能 vue-clipboard2

1.安装vue-clipboard2插件

npm install --save vue-clipboard2 

2.查看配置文件package.json

检查vue-clipboard2是否安装成功

3.main.js添加

import VueClipboard from 'vue-clipboard2'
Vue.use(VueClipboard)

4.

 <el-button v-if="orderStatus === 2" style="margin-left:20px;" type="text" size="medium"
     v-clipboard:copy="'收件人：'+orderInfo.consignee+'\n手机号：'+orderInfo.tel+'\n地址：'+ orderInfo.province_name + orderInfo.city_name + orderInfo.district_name + orderInfo.address"
     v-clipboard:success="onCopy"
     v-clipboard:error="onError">复制收货人信息
 </el-button>

    // 复制成功
    onCopy(e){
      this.$message({
        message: '复制成功',
        type: 'success'
      })
    },
    // 复制失败
    onError(e){
      alert("失败");
    },