ClipboardButton

使用法

import { useState } from 'react';
import { ClipboardButton } from '@wordpress/components';
const MyClipboardButton = () => {
   const [ hasCopied, setHasCopied ] = useState( false );
   return (
   <ClipboardButton
   variant="primary"
   text="Text to be copied."
   onCopy={ () => setHasCopied( true ) }
   onFinishCopy={ () => setHasCopied( false ) }
   >
   { hasCopied ? 'Copied!' : 'Copy Text' }
   </ClipboardButton>
   );
};

プロパティ

コンポーネントは以下のプロパティを受け入れます:

className

基盤となる <Button> コンポーネントのクラスに追加されるクラスです。

• タイプ: string
• 必須: いいえ
  

text

クリップボードにコピーされるテキストです。

• タイプ: string
• 必須: はい
  

onCopy

テキストがコピーされたときに呼び出される関数です。

— タイプ: () => void

— 必須: はい

onFinishCopy

テキストがコピーされ、コピーアニメーションが終了したときに呼び出される関数です。

— タイプ: () => void

— 必須: いいえ

継承されたプロパティ

追加のプロパティは基盤となる <Button/> コンポーネントに渡されます。利用可能なプロパティの詳細については、Button コンポーネントを参照してください。