Project/모라도 공유노트
-
[공유노트] React Router dom - useLocationProject/모라도 공유노트 2022. 2. 28. 02:15
페이지마다 다른 스타일의 Header 컴포넌트를 보여주고 싶은 경우 Home 페이지 New, ViewPage, NotFound 페이지 01. React Router dom - useLocation Link 태그에 current={location.pathname !== "/"} 속성을 추가한다. useLocation : url 정보 가져오는 함수 pathname : 이동할 페이지 주소 // Header.js import { Link, useLocation } from "react-router-dom"; ... export const Header = () => { const location = useLocation(); // console.log(location); return ( 공유노트 ); }; con..
-
[공유노트] Svg 컴포넌트 사용Project/모라도 공유노트 2022. 2. 27. 23:23
리액트 협업 프로젝트 : 개발 관련 유용한 정보 공유 목적의 웹페이지 URL 아카이빙 서비스 01. svg 이미지 사용방식 Svg.js에 필요한 아이콘을 컴포넌트화해서 사용하는 방식이다. svg 이미지의 크기, 컬러 변경의 여지를 고려했을 때 원하는 대로 커스텀이 가능하기 때문에 컴포넌트화 하는 방식을 사용해보면 좋다. svg 코드에서 바꾸고자 하는 요소를 current로 바꾼 후, 사용하는 컴포넌트에서 props로 내려준 후 수정 가능하다. // Svg.js export const ExternalLink = () => { return ( ... ); }; export const ArrowDown = () => { return ( ... ); }; ... // ViewCard.js import Exter..