라우터 (2) 썸네일형 리스트형 [React-Router] 리액트 라우터 npm install react-router-dom 설치는 위 커맨드로 한다. import { BrowserRouter, Route, Routes } from 'react-router-dom' function App() { return ( ) } 위와 같은 형태로 변화하는 몸체를 만든다. BrowserRouter로 감싼 후 Routes 부분이 변화하는 부분인데 Route 태그에 path를 넣어 경로를 표현하고, element를 이용해 컴포넌트를 설정한다. import { Link } from 'react-router-dom' const Header = () => { return ( Animall Board Training Shop Trip Me ) } 라우트 링크는 위와 같이 Link를 이용해 설정한다... [Routing] Vue-Router 없이 라우팅하기 화면이 좌/우로 트랜지션(?)되는 라우터를 만들어보자. App.vue 각 컴포넌트의 표시 여부를 관리하는 showComponent2, showComponent3, showComponent4 변수를 선언했다. 전환 효과를 위한 transitionName 변수를 선언했다. 초기 화면에는 Component1만 보이게 하고 Component1에서 이벤트를 발생시키면, Component2가 나타나고, Component1은 사라진다. Component2에서 이벤트를 발생시키면, Component3 또는 Component4가 나타나고, Component2는 사라진다. Component3에서 이벤트를 발생시키면, Component2가 다시 나타나고, Component3은 사라진다. Component4에서 이벤트를 발생.. 이전 1 다음