>  기사  >  웹 프론트엔드  >  vue는 콘텐츠를 클립보드에 복사하는 방법을 구현합니다.

vue는 콘텐츠를 클립보드에 복사하는 방법을 구현합니다.

亚连
亚连원래의
2018-05-29 17:02:562826검색

이제 내용을 클립보드에 복사하는 Vue 방법을 공유하겠습니다. 참고할 가치가 높으며 모두에게 도움이 되기를 바랍니다.

1. 프로젝트 디렉토리 파일에 설치된 npm

npm install clipboard --save

2. html에 맞춤 속성이 필요한 데이터 클립보드에 소개 파일을 가져옵니다. element -text

import Clipboard from 'clipboard';

4 에 복사할 내용을 작성합니다. JavaScript의 클래스 이름을 통해 해당 요소의 내용을 찾습니다.

<button class="copyBtn" :data-clipboard-text = "https://www.baidu.com/" type="text">复制地址</button>

이 주소가 필요하면 메서드에서 직접 클립보드 변수를 참조하면 됩니다. 그렇지 않으면 이 변수에 대해 걱정하지 마세요. . 클래스 이름이 copyBtn인 버튼을 클릭한 후 Ctrl+v를 누르세요.

위 내용은 앞으로 모든 사람에게 도움이 되기를 바랍니다.

관련 기사:

js의 DOM 이벤트 바인딩 분석

JavaScript의 일반적인 작업 방법 및 문자열의 특수 문자


jQuery의 각 메서드 사용에 대한 자세한 설명


위 내용은 vue는 콘텐츠를 클립보드에 복사하는 방법을 구현합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.