react-copy-to-clipboard 오류 발생

'CopyToClipboard' cannot be used as a JSX component.
Its instance type 'CopyToClipboard' is not a valid JSX element.
Property 'refs' is missing in type 'PureComponent<Props, {}, any>' but required in type 'ElementClass'.ts(2786)

 

react-copy-to-clipboard를 사용하려고 하는데 위와 같은 오류가 발생...

 

yarn add react-copy-to-clipboard
yarn add -D @types/react-copy-to-clipboard

type문제인가 싶어서 types도 설치 해줬고 

IDE에서 typescript 도 재시작 해줬는데 안된다...

 

🚀 해결방법

const ClipboardComponent = CopyToClipboard as any

<ClipboardComponent
    text={`${account.bankName} ${account.accountNumber}`}
    onCopy={() => {
      alert('복사되었습니다.')
    }}
  >
    <button type="button" className={cx('button')}>
      복사
    </button>
  </ClipboardComponent>

타입 체크를 우회하는 방식으로 이용하기로...

TypeScript가 CopyToClipboard를 JSX 컴포넌트로 인식하지 못하는 것 같아서...

as any로 강제 캐스팅해버리니까 잘된다...

 

성공적 👍