Vue.js复制粘贴插件Clipboard的使用_亲测可用

安装Clipboard

本人使用npm安装，当然您也可以使用"<script"引入

npm install clipboard --save

引入Clipboard

import Clipboard from 'clipboard'

上内容代码

<template>
  <div>{{ orderArrStr }}</div> <!-- 要复制的内容，点这里点这里-->

  <div class="copy-word"  
  @click="copyGreetings('copy-word')" 
  :data-clipboard-text="orderArrStr"></div> 
  
</template>

<script>
import Clipboard from 'clipboard'
export default {
  data() {
    return {
      orderArrStr: '我就是谁，我在哪，看到我就点点我'
      }
  },
  methods: {
    copyGreetings(el) {
      // 复制订单数据结构
      var clipboard = new Clipboard(`.${el}`)
      clipboard.on('success', e => {
        // success("复制成功");//这里你如果引入了elementui的提示就可以用，没有就注释即可
        // 释放内存
        this.$message({
          message: '复制成功',
          type: 'success'
        })
        clipboard.destroy()
      })
      clipboard.on('error', e => {
        // 不支持复制
        this.$message({
          message: '复制失败，该浏览器不支持自动复制',
          type: 'success'
        })
        // 释放内存
        clipboard.destroy()
      })
    }
  }
}
</script>

至此，结束，亲们可以尝试一下！