useCopyToClipboard

The useCopyToClipboard hook is a hook that allows you to copy a string to the clipboard. It returns a function that receives a string as a parameter and copies it to the clipboard.

Importation

Make sure you are importing the useCopyToClipboard hook from the pol-ui library in your React component.

import { useCopyToClipboard } from "pol-ui";

Usage

This is the most basic usage of the useCopyToClipboard hook.

const { copiedText, copy } = useCopyToClipboard();

Methods

copy

The copy method is a function that receives a string as a parameter and copies it to the clipboard.

const { copiedText, copy } = useCopyToClipboard();
 
copy("Hello, world!");

Returned values

The useCopyToClipboard hook returns an object with the following properties:

copiedText

The copiedText is a string that contains the last string that was copied to the clipboard.

copy

The copy is a function that receives a string as a parameter and copies it to the clipboard.

Example

import React from "react";
import { useCopyToClipboard } from "pol-ui";
 
export default function App() {
  const { copiedText, copy } = useCopyToClipboard();
 
  return (
    <div>
      <button onClick={() => copy("Hello, world!")}>Copy</button>
      {copiedText && <p>Copied: {copiedText}</p>}
    </div>
  );
}