Maison  >  Article  >  interface Web  >  vue implémente la méthode de copie du contenu dans le presse-papiers

vue implémente la méthode de copie du contenu dans le presse-papiers

亚连
亚连original
2018-05-29 17:02:562764parcourir

Maintenant, je vais partager avec vous une méthode pour copier du contenu dans le presse-papiers dans Vue. Elle a une bonne valeur de référence et j'espère qu'elle sera utile à tout le monde.

1. npm installé dans le fichier du répertoire du projet

npm install clipboard --save

2.

import Clipboard from 'clipboard';

3 Écrivez les données à copier dans data-clipboard-text dans l'attribut personnalisé de l'élément html requis. Contenu

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

4. Recherchez le contenu dans l'élément via le nom de la classe en JavaScript.

let clipboard = new Clipboard(&#39;.copyBtn&#39;);

Ça y est Si vous avez besoin de cette adresse, référencez directement le presse-papier dans la méthode Juste. utilisez une variable. Si vous n'en avez pas besoin, ne vous inquiétez pas pour cette variable. Après avoir cliqué sur le bouton avec le nom de classe copyBtn,

Le ci-dessus est ce que j'ai compilé. Pour tout le monde, j'espère que cela sera utile à tout le monde à l'avenir.

Articles connexes :

Analyse de la liaison d'événements DOM dans js

Méthodes d'opération courantes et opérations de chaîne spéciales dans les caractères JavaScript

Explication détaillée de l'utilisation de chaque méthode dans jQuery

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn