vue 實現點擊復制文本


1.引入插件clipboard.js方法如下:

直接npm安裝: npm install clipboard --save

2.在需要使用的組件中important

引用方法:import Clipboard from 'clipboard'

3.添加需要復制的內容

例如:

//  data-clipboard-taxt 里面就是我們需要復制的文本
<button class="tag-read" data-clipboard-text="我是可以復制的內容,請點擊復制" @click="copy">復制</button>

4.添加點擊后的方法

copy () {
   var clipboard = new Clipboard('.tag-read')
   clipboard.on('success', e => {
      console.log('復制成功')
      //  釋放內存
     clipboard.destroy()
   })
    clipboard.on('error', e =>{
     // 不支持復制
     console.log('該瀏覽器不支持復制')
     // 釋放內存
     clipboard.destroy()
   })
}


免責聲明!

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



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