Front-end/리액트 개념

React에서 클릭 시 클립보드에 저장하기 기능

유호야 2023. 6. 25. 05:34
반응형

JS말고 React에서 간단하게 구현 가능하다

ChatGPT한테 물어보니까 간단하게 구현 완료

import React from 'react';

function CopyTextComponent() {
  const handleCopyClick = (textToCopy) => {
    navigator.clipboard.writeText(textToCopy)
      .then(() => {
        alert('텍스트가 복사되었습니다.');
      })
      .catch((error) => {
        console.error('복사 실패:', error);
      });
  };

  return (
    <span onClick={() => handleCopyClick('복사할 텍스트')}>
      클릭하여 텍스트 복사
    </span>
  );
}

export default CopyTextComponent;

 

반응형