复制功能

css:

<div class="refund_num">
          <p>退款编号:</p>
          <p class="number">{{bodyData.backNo}}</p>
          <p class="copy" :data-clipboard-text="copytext" @click="copyText">复制</p>
</div>

script:

<script>
    // 引入Clipboard
    import Clipboard from 'clipboard'
    data () {
        return {
            clipboard: '',
            copytext: '' // 复制退款编号
        }
    }
    beforeDestroy () {
         this.clipboard = null
    },
    methods: {
        // 复制退款编号
        copyText () {
            this.clipboard = new Clipboard('.copy')
            this.clipboard.on('success' , e => {
                Toast({message: '已复制退款编号',duration: 700})
            })
            this.clipboard.on('success', e => {
                Toast(message: '复制失败,请重试', duration: 700)
            })
        }
    }
</script

  

posted @ 2020-03-03 15:41  文文iou  阅读(219)  评论(0)    收藏  举报