Vue implements the method of copying content to the pasteboard

How to copy content to the pasteboard? This article mainly shares with you a method of copying content to the clipboard in Vue. It has a good reference value and I hope it can help everyone.

1 . npm installed into the project directory file

npm install clipboard --save

2 . import the introduction file

import Clipboard from 'clipboard';

3. Write the content to be copied in data-clipboard-text in the custom attribute in the html element

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

4. Find the element through the class name in JavaScript Content.

let clipboard = new Clipboard('.copyBtn');

That’s it. If you need this address, just reference the clipboard variable directly in the method. If not, don’t worry about this variable. It does not require any processing. After clicking the button with the class name copyBtn, just Ctrl+v.

Related recommendations:

JavaScript to implement copying Content to pasteboard code_javascript tips

The above is the detailed content of Vue implements the method of copying content to the pasteboard. For more information, please follow other related articles on the PHP Chinese website!