在vue使用clipboard.js進行一鍵復制文本的實現示例

最近在做商城項目,有個需求是需要點擊復制訂單號的,然后就覺得可以使用原生的復制方法和使用第三方庫 。
瀏覽器原生方法
這種方式兼容性不是太好,還要看瀏覽器是否支持,容易采坑 。

在vue使用clipboard.js進行一鍵復制文本的實現示例

【在vue使用clipboard.js進行一鍵復制文本的實現示例】使用 clipboard.js
我們要先安裝
在vue使用clipboard.js進行一鍵復制文本的實現示例

在 mian.js 中引入 , 當然我們也可以在用到的 .vue 中引入,因為我不止一個地方用到了復制,所以直接在 main.js 里面引入了 。
在vue使用clipboard.js進行一鍵復制文本的實現示例

在需要的地方使用
在vue使用clipboard.js進行一鍵復制文本的實現示例

當然 clipboard.js 的功能可不止這么簡單,我們還可使用它進行剪切,還可以通過它復制其他元素的值等,具體的使用可查看官方文檔: clipboard.js ;

小結

關于瀏覽器一鍵復制,推薦使用 clipboard.js 來做,因為現在原生方法兼容性并不是很好 , 而且 clipboard.js 文件并不大,但是卻可以幫我們做很多事情,減輕很多調試和避免采坑 。

相關經驗推薦