react-card-flip icon indicating copy to clipboard operation
react-card-flip copied to clipboard

example using the State Hook no readme :)

Open tamaracosta opened this issue 2 years ago • 0 comments

import { useState } from 'react'; import ReactCardFlip from 'react-card-flip';

const Card = () => { const [isFlipped, setIsFlipped] = useState(false)

function handleClick(e) { e.preventDefault(); setIsFlipped(!isFlipped); }

return ( <> <ReactCardFlip isFlipped={isFlipped} flipDirection="horizontal"> <YOUR_FRONT_CCOMPONENT> This is the front of the card. <button onClick={handleClick}>Click to flip </YOUR_FRONT_CCOMPONENT>

    <YOUR_BACK_COMPONENT>
      This is the back of the card.
      <button onClick={handleClick}>Click to flip</button>
    </YOUR_BACK_COMPONENT>       
  </ReactCardFlip>
</>

) }

export default Card;

tamaracosta avatar Jan 26 '23 17:01 tamaracosta