jsm-mall-front/src/components/Common/copy-button.vue

<template>
  <i class="el-icon-copy-document tag-read" v-if="copyText" @click="copy(copyText)" :data-clipboard-text="copyText">
  </i>
</template>

<script>
import Clipboard from 'clipboard'

export default {
  name: 'CopyButton',
  props: {
    copyText: {
      // 复制文本
      type: String,
      default: ''
    }
  },
  data() {
    return {}
  },
  methods: {
    copy() {
      const clipboard = new Clipboard('.tag-read')
      // clipboard.on('success', e => {
      //   this.$successMsg('复制成功');
      // })
      clipboard.on('error', e => {
        console.log('该浏览器不支持复制')
        return false
      })
      this.$successMsg('复制成功')
    }
  }
}
</script>

<style lang="scss" scoped>
.tag-read {
  color: #409eff;
  cursor: pointer;
  margin-right: 4px;
}
</style>