In reactJS, how to copy text to clipboard?

Question

I\'m using ReactJS and when a user clicks a link I want to copy some text to the clipboard.

I am using Chrome 52 and I do not need to support any other browsers.

Answer 1

You can also use react hooks into function components or stateless components with this piece of code: PS: Make sure you install useClippy through npm/yarn with this command: npm install use-clippy or yarn add use-clippy

import React from 'react';
import useClippy from 'use-clippy';

export default function YourComponent() {

// clipboard is the contents of the user's clipboard.
  // setClipboard('new value') wil set the contents of the user's clipboard.

  const [clipboard, setClipboard] = useClippy();

  return (
    


      {/* Button that demonstrates reading the clipboard. */}
       {
          alert(`Your clipboard contains: ${clipboard}`);
        }}
      >
        Read my clipboard
      

      {/* Button that demonstrates writing to the clipboard. */}
       {
          setClipboard(`Random number: ${Math.random()}`);
        }}
      >
        Copy something
      
    
  );
}