220224,220225 - ClipBoard, React-Router v6

220224,220225 - ClipBoard, React-Router v6

220224,220225 - ClipBoard, React-Router v6

220224,220225 - ClipBoard, React-Router v6

작성일 : 2022.02.24

TIL
JavaScript
React

React-Router v6에서 History를 사용하려면

  • useHistory, History가 useNavigate로 바뀜.
  • 사용법
    import { useNavigate } from "react-router-dom";
    const navigate = useNavigate();
    navigate(`/${item.key}`);
    
  • 2 번째 prop은 넘겨주는 prop

부모 태그의 이벤트 중지

  • event.stopPropagation()

ClipBoard에 내용 복사하기

  • document.execcommand는 레거시 코드라 이제 사용하지 않음.
  • Navigator.clipboard로 클립보드에 넘겨 줄 수 있음.
  • 클립보드에 넣어줄 때는 다음과 같이 사용
    navigator.clipboard.writeText(text).then(() => {
        window.alert("클립보드에 복사되었습니다.");
    });
    
  • 클립보드에 있는 값을 읽을 때는 다음과 같이 사용
    navigator.clipboard.readText().then(clipText => window.alert(`읽은 값은 '${clipText}'입니다.`)
    
copyright by dabin jeong