Maison > interface Web > js tutoriel > 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

亚连
Libérer: 2018-05-29 17:02:56
original
2883 Les gens l'ont consulté

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
Copier après la connexion

2.

import Clipboard from 'clipboard';
Copier après la connexion

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>
Copier après la connexion

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

let clipboard = new Clipboard(&#39;.copyBtn&#39;);
Copier après la connexion

Ç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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal