ホームページ  >  記事  >  ウェブフロントエンド  >  Vue はコンテンツをペーストボードにコピーするメソッドを実装します

Vue はコンテンツをペーストボードにコピーするメソッドを実装します

小云云
小云云オリジナル
2018-03-19 10:28:122446ブラウズ

コンテンツをペーストボードにコピーするには?この記事では主に、Vue でコンテンツをクリップボードにコピーする方法について説明します。これは非常に参考になるので、皆さんのお役に立てれば幸いです。

1. プロジェクトディレクトリファイルにnpmをインストールします

npm install clipboard --save

2. 導入ファイルをインポートします

import Clipboard from 'clipboard';

3. html要素のカスタム属性にコピーするdata-clipboard-textを記述します。

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

の内容 4. JavaScript のクラス名で要素の内容を検索します。

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

このアドレスが必要な場合は、メソッド内でクリップボード変数を直接参照するだけで、この変数については何もする必要はありません。クラス名をクリックします。copyBtn ボタンをクリックした後、Ctrl+v をクリックします。


JavaScript でコンテンツをペーストボードにコピーします。 code_javascript スキル


以上がVue はコンテンツをペーストボードにコピーするメソッドを実装しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。