vue中使用剪切板插件 clipboard.js


vue中使用剪切板需要借助一個插件,clipboard,使用方法還是很簡單的,先下載,然后引入:

npm i clipboard -S

//引入
import Clipboard from 'clipboard';

下面就是使用了,比如說,比較常見的是,上面一行文字,下面有一個復制的按鈕,
<p id="share-code">{{init.code}}</p>
<button class="copy-btn" data-clipboard-action="copy" data-clipboard-target="#share-code" @click="copy">copy</button>

<script> copy() { if(!this.init) return; var clipboard = new Clipboard('.copy-btn') clipboard.on('success', e => { console.log('復制成功') this.toast('copy success'); // 釋放內存 clipboard.destroy(); }) clipboard.on('error', e => { // 不支持復制       //console.log('該瀏覽器不支持自動復制') // 釋放內存 clipboard.destroy() }) } }, </script>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM