Link Search Menu Expand Document

클립보드로 복사하는 방법

작성자 : 유영창 (frog@falinux.com), 작성일 : 2021년 9월 24일(금)

설치

$ npm i -D clipboard

사용 소스 예제

<template>
  <div>
    <el-input v-model="inputData" placeholder="Please input" style="width:400px;max-width:100%;" />
    <el-button type="primary" icon="el-icon-document" @click="onClipboardCopy">
  </div>
</template>

<script>
import Clipboard from 'clipboard'
export default {
  name: 'clipboard-copy',
  data () {
    return {
      inputData: 'coping data...' 
    }
  },
  methods: {
    onClipboardCopy (event) {
      const clipboard = new Clipboard(event.target, { text: () => this.inputData })
      clipboard.on('success', () => { clipboard.destroy() })
      clipboard.on('error', () => { clipboard.destroy() })
      clipboard.onClick(event)
    }
  }
}
</script>


Table of contents