vue router 2

[Vue] 라우터(Router) 방식 (Nested Routers, Named Views)

1. Nested Routers 라우터 컴포넌트 안에 하위 컴포넌트를 중첩하여 구성 특정 URL에 지정된 하나의 컴포넌트가 여러 개의 하위 컴포넌트를 가짐 children 옵션 사용 2. Named Views 특정 URL에 같은 레벨의 다수의 컴포넌트를 '영역별'로 지정하여 렌더링 components 옵션 사용 현재 실무에서는 기본 라우터 형식이나, 1번 형식이 종종 보이는 듯 하다. 참고 router-link에 path말고, name값을 적어줄 수도 있다. 그럼 name이랑 매핑되겠지 .. ? User const routes = [ { path: '/user/:username', name: 'user', component: User } ]

📕 Language/Vue 2022.05.04

[Vue] 라우터(Router)

Vue js의 페이지 이동을 위한 라이브러리 : 페이지 이동할 때 url 변경되면, 변경된 요소의 영역에 컴포넌트를 갱신 - SPA의 특징 (단일 페이지 어플리케이션, Single Page Application) : 브라우저에 단 한번, 페이지 전체 로드. 이후에는 특정 부분만 Ajax를 통해 데이터 바인딩 - DOM을 새로 갱신하는 것은 아니다. router/index.js 라우터를 설정할 js 파일 - export default 처리하여 밖으로 내보내면서, router로 선언한다. - mode 속성을 이용하여 history 처리를 하면 url에 #이 제거 되어진다. - path는 대상 경로, name은 라우터에 이름을 부여(아래 예시에는 없음). component는 router-view 영역에 보여줄..

📕 Language/Vue 2022.05.04
반응형