Как организуется маршрутизация во Vue-приложении?

Question

Маршрутизация во Vue организуется с помощью Vue Router. Маршруты описываются в конфигурации и связываются с компонентами. Приложение отображает нужный компонент в зависимости от URL. Поддерживаются вложенные маршруты и параметры. Это позволяет строить сложные SPA без перезагрузки страницы.

YeaHub · Accepted Answer

Маршрутизация во Vue строится декларативно и централизованно.Базовая структураОбычно маршрутизация включает:файл конфигурации роутовэкземпляр роутеракомпонент-обёртку для отображения маршрутовПример базовой конфигурации:const routes = [
  { path: '/', component: Home },
  { path: '/users', component: Users }
]
Отображение маршрутовДля вывода компонентов используется специальный контейнер:<router-view />
Vue Router подставляет туда компонент, соответствующий текущему URL.Вложенные маршрутыДля сложных интерфейсов применяются вложенные маршруты:страницы с табамиlayout с внутренней навигациейmaster-detail интерфейсыМасштабированиеВ крупных проектах:маршруты разбиваются по модулямиспользуется lazy loadingвводятся layout-компонентыКраткий выводМаршрутизация во Vue строится вокруг конфигурации маршрутов и router-view, что позволяет гибко управлять навигацией SPA.