ホームページ > ウェブフロントエンド > jsチュートリアル > Vue はコンテンツをペーストボードにすばやくコピーします (コードが添付されています)

Vue はコンテンツをペーストボードにすばやくコピーします (コードが添付されています)

php中世界最好的语言
リリース: 2018-05-10 14:27:19
オリジナル
4525 人が閲覧しました

今回は、vue でコンテンツをペーストボードに素早くコピーする方法 (コード付き) を紹介します。vue でコンテンツをペーストボードに素早くコピーするための 注意事項 について、実際のケースを見てみましょう。

1 . npm をプロジェクトディレクトリファイル

npm install clipboard --save
ログイン後にコピー

にインストールします 2. 導入ファイル

import Clipboard from 'clipboard';
ログイン後にコピー

をインポートします に必要な data-clipboard-text を書き込みますhtml 要素 コピーするコンテンツを入力します

<button class="copyBtn" :data-clipboard-text = "https://www.baidu.com/" type="text">复制地址</button>
ログイン後にコピー

4.

JavaScript のクラス名で要素内のコンテンツを検索します。

let clipboard = new Clipboard('.copyBtn');
ログイン後にコピー

このアドレスが必要な場合は、メソッド内で変数を直接

quote

クリップボードするだけです。必要ない場合は、この変数について心配する必要はありません。何も処理する必要はありません。クラス名 copyBtn のボタンをクリックした後、Ctrl+v をクリックしてください。この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い内容を参照してください。その他の関連記事は php 中国語 Web サイトにあります。

推奨読書:

集約カスケードクエリの実装手順

リンクからQRコード画像を生成するJSメソッドの分析

以上がVue はコンテンツをペーストボードにすばやくコピーします (コードが添付されています)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート