두 가지 클립보드 복사 기능 구현 방법

#1

특별한 라이브러리 없이 javascript로만 클립보드 복사 기능을 구현하는 방법입니다.

가볍게 복사 기능을 사용하길 원하시는 분께 적합할 것 같습니다.

See the Pen Walkers - How to by Louis Hoebregts (@Mamboleoo) on CodePen.

 

#2

vue-clipboard2 라이브러리를 사용하는 방법입니다.

npm install vue-clipboard2로 설치한 후 사용하면 됩니다.

 

[테스트 버전]

- vue 2.6.11

- vue-clipboard 0.3.1

<div id="app">
  <div>
    <textarea v-model="myInput"></textarea>
    <button type="button" @click="doCopy">Copy!</button>
  </div>
</div>

new Vue({
  el: '#app',
  data: {
    myInput: ''
  },
  methods: {
    doCopy() {
      this.$copyText(this.myInput);
      alert(this.myInput + '을 복사했습니다.');
    }
  }
});

 

I made a thumbnail for free in website "www.forcre.co.kr"