# navlink

8개의 포스트

Link 와 NavLink active 표시

여기서는 react-router-dom V6 버전을 다룹니다. Link의 주소로 이동함과 동시에 indicator를 보여주고싶을 경우Link tag url 일치 일경우 true값을 반환 NavLink tag자체적으로 isActive라는 boolean값을 가지고 있다.

2022년 2월 1일
·
0개의 댓글

NavLink

리액트 프로젝트에서 Link 대신에 NavLink를 사용함으로써, active한 Link에 스타일을 적용시킬 수 있다. 이를 통해서, 클릭된 링크의 배경색을 바꾸는 등의 스타일의 적용이 가능하다.

2022년 1월 11일
·
0개의 댓글

[React] react-router-dom의 NavLink

react-router-dom의 NavLink에 대해 알아보자.

2021년 10월 26일
·
0개의 댓글
post-thumbnail

[React #8] React-Router로 SPA 구현하기

SPA SPA(Single Page Application)은 페이지가 한개인 어플리케이션을 뜻한다. HTML에서는 페이지 수만큼 HTML 파일이 존재하지만, React에서 .html 파일의 개수는 1개다. 즉, React는 SPA 기반으로 작동된다. 한 웹페이지 안에서

2021년 10월 12일
·
0개의 댓글
post-thumbnail

라우팅(페이지) 이동: Link, NavLink, Redirect

\-a tag: 앱을 새로고침하면서 경로를 이동합니다.\-브라우저의 주소를 바꾸고,맞는 Route 로 화면을 변경합니다.\-import { Link } from 'react-router-dom'; 한다. \-activeClassName, activeStyle 처럼 ac

2021년 9월 14일
·
0개의 댓글
post-thumbnail

[React] 리액트 라우터로 SPA 개발하기

본 글은 [리액트를 다루는 기술] 13장을 참고하여 포스팅하였습니다. SPA, Route 컴포넌트, Link 컴포넌트, Link 컴포넌트, URL 파라미터, URL쿼리, 서브 라우트, 라우터 부가기능에 대해 정리하였습니다.

2021년 7월 12일
·
0개의 댓글
post-thumbnail

React Router 2

React Router 2 (withRouter,match,location,history)

2020년 6월 16일
·
0개의 댓글

React Router

React Router 서로 다른 주소를 가진 view 를 만들어 관리하는 방법을 알아봅니다.

2020년 6월 1일
·
0개의 댓글