이름이 있는 라우트

라우트를 생성할 때 선택적으로 라우트에 name 을 지정가능

const routes = [
  {
    path: '/user/:username',
    name: 'profile', 
    component: User
  }
]

 

그러면 <router-link>에 to prop 을 전달할 때 path 대신 name 을 사용할 수 있음

<router-link :to="{ name: 'profile', params: { username: 'erina' } }">
  사용자 프로필
</router-link>

 

이렇게 되면 /user/erina 로 링크를 생성하게 된다

 

• name 을 사용했을 때의 이점
• 하드코딩 URL 없음
• params 의 자동 인코딩
• URL 오타방지
• 경로 순위를 우회하여, 같은 경로와 일치하는 하위 순위 라우트를 표시

 

각 이름은 모든 라우트에서 유일해야함, 같은 여러 라우트에 추가하면 라우터는 마지막 것만 유지할 것임