Повторяющиеся сегменты

В маршрутизации веб-приложений часто возникает ситуация, когда часть пути повторяется в нескольких маршрутах. Библиотека Universal Router предоставляет гибкие средства для работы с повторяющимися сегментами URL, что позволяет создавать лаконичные и масштабируемые маршруты без дублирования кода.

Использование параметров с повторяющимися сегментами

В Universal Router маршруты могут содержать параметры сегментов, которые повторяются несколько раз в пути. Например, путь вида:

/users/:userId/posts/:postId/comments/:commentId

Содержит три параметра :userId, :postId и :commentId. При необходимости обработать множественные повторяющиеся сегменты можно использовать регулярные выражения в параметрах:

const routes = [
  {
    path: '/files/:path(.*)',
    action: ({ params }) => {
      return `Путь к файлу: ${params.path}`;
    }
  }
];

Здесь :path(.*) позволяет захватывать все повторяющиеся сегменты после /files/. Такой подход особенно полезен для вложенных директорий или динамических маршрутов с неизвестной глубиной.

Группировка маршрутов с общим префиксом

Когда несколько маршрутов начинаются с одинакового префикса, Universal Router позволяет использовать вложенные маршруты для повторяющегося сегмента:

const routes = [
  {
    path: '/users/:userId',
    children: [
      {
        path: 'posts',
        action: ({ params }) => `Список постов пользователя ${params.userId}`
      },
      {
        path: 'settings',
        action: ({ params }) => `Настройки пользователя ${params.userId}`
      }
    ]
  }
];

Здесь сегмент /users/:userId повторно используется для всех вложенных маршрутов. Такая структура улучшает читаемость кода и упрощает поддержку.

Динамические вложенные маршруты

Для сложных приложений часто требуется маршрутизация с переменной глубиной. Universal Router позволяет строить динамические цепочки вложенных маршрутов через функцию children, которая может возвращать массив маршрутов на основе текущих параметров:

const routes = [
  {
    path: '/categories/:categoryId',
    children: ({ params }) => [
      {
        path: 'products/:productId',
        action: () => `Продукт ${params.productId} в категории ${params.categoryId}`
      }
    ]
  }
];

Такой подход делает возможным повторное использование сегмента :categoryId для всех маршрутов внутри категории без дублирования.

Повторяющиеся сегменты и именованные параметры

Universal Router поддерживает именованные параметры с повторяющимися сегментами, что особенно удобно для REST API:

const routes = [
  {
    path: '/api/:version/users/:userId',
    action: ({ params }) => `API версия: ${params.version}, пользователь: ${params.userId}`
  }
];

Использование именованных параметров позволяет чётко разделять роли сегментов и обрабатывать их независимо, даже если структура маршрута повторяется в разных частях приложения.

Рекурсивная маршрутизация

Для случаев, когда маршруты могут повторяться на нескольких уровнях, применяют рекурсивные структуры:

const routes = [
  {
    path: '/category/:id',
    children: [
      {
        path: '/category/:id',
        children: ({ params }) => [
          { path: 'details', action: () => `Детали категории ${params.id}` }
        ]
      }
    ]
  }
];

Рекурсивные маршруты позволяют динамически формировать структуру, где один и тот же сегмент может повторяться несколько раз на разных уровнях иерархии.

Практические рекомендации

  • Избегать дублирования: повторяющиеся сегменты лучше вынести в общий родительский маршрут.
  • Использовать регулярные выражения: для маршрутов с произвольной глубиной сегментов.
  • Именовать параметры: чтобы легко получать доступ к значениям даже при повторении сегментов.
  • Вложенные маршруты: позволяют логически группировать повторяющиеся части URL и упрощают масштабирование.
  • Динамические функции children: обеспечивают гибкость при построении маршрутов на лету, особенно при сложных структурах данных.

Повторяющиеся сегменты в Universal Router позволяют строить чистую и управляемую маршрутизацию, минимизируя дублирование кода и обеспечивая удобную работу с параметрами, вложенностью и динамическими путями.

Оглавление