Интерфейс RouteContext

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

Основные свойства RouteContext

pathname

Свойство pathname содержит текущий путь запроса, нормализованный до строки, начиная с символа /. Этот путь используется для сопоставления с маршрутами и может быть изменён при необходимости внутри маршрутизатора.

{
  pathname: '/users/42'
}

params

params — объект, содержащий параметры маршрута, извлечённые из динамических сегментов пути. Например, для маршрута /users/:id при переходе на /users/42 объект params будет следующим:

{
  id: '42'
}

Динамические параметры позволяют создавать универсальные маршруты, которые подстраиваются под значения в URL.

query

Свойство query используется для хранения параметров запроса URL (query string). Universal Router не парсит query string автоматически, поэтому чаще всего это делается вручную, либо через сторонние утилиты.

{
  query: {
    search: 'john',
    page: '2'
  }
}

route

Свойство route хранит текущий маршрут, который был выбран для обработки запроса. Оно содержит все свойства, указанные в маршруте, включая path, action и дополнительные данные.

{
  path: '/users/:id',
  action: async (context) => { /* ... */ },
  title: 'Профиль пользователя'
}

parent

parent указывает на родительский контекст маршрута. Это полезно при вложенных маршрутах, где требуется доступ к параметрам или состоянию родительского маршрута.

{
  parent: {
    pathname: '/users',
    params: {}
  }
}

baseUrl

baseUrl — путь родительского маршрута, используемый для вычисления относительных URL при вложенных маршрутах. Это позволяет строить маршруты динамически относительно родительского пути.

previousPathname

Свойство previousPathname хранит путь, с которого был совершен переход. Полезно для реализации функционала «назад» или анализа навигации пользователя.

Методы и функции в контексте

resolve(route)

Метод resolve позволяет программно разрешить маршрут внутри текущего контекста. Обычно используется внутри action для перенаправлений или динамической маршрутизации.

await context.resolve('/login');

Метод navigate служит для перехода на новый путь, с возможностью указания дополнительных параметров, таких как replace или state.

context.navigate('/dashboard', { replace: true });

Использование RouteContext в обработчиках маршрутов

Каждый маршрут в Universal Router получает объект RouteContext как аргумент функции action. Это позволяет:

  • Получать текущие параметры URL
  • Доступ к родительским маршрутам и базовым URL
  • Управлять переходами между маршрутами
  • Хранить и передавать дополнительные данные между маршрутами

Пример использования:

const routes = [
  {
    path: '/users/:id',
    action: async (context) => {
      const userId = context.params.id;
      const userData = await fetchUser(userId);
      return {
        title: `Пользователь ${userData.name}`,
        data: userData
      };
    }
  }
];

const router = new UniversalRouter(routes);

router.resolve('/users/42').then(result => {
  console.log(result.title); // Пользователь John Doe
});

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

При работе с вложенными маршрутами каждый дочерний маршрут получает доступ к контексту родителя через parent. Это позволяет:

  • Использовать параметры родительского маршрута в дочерних маршрутах
  • Построение относительных URL через baseUrl
  • Совместное использование данных между маршрутами без глобального состояния
const routes = [
  {
    path: '/users',
    children: [
      {
        path: ':id',
        action: (context) => {
          console.log(context.parent.pathname); // /users
          console.log(context.baseUrl); // /users
          return `User ${context.params.id}`;
        }
      }
    ]
  }
];

Ключевые особенности RouteContext

  • Доступ к параметрам маршрута и query — полный контроль над URL
  • Поддержка вложенных маршрутов — легко строить сложные структуры
  • Методы для программной навигации и разрешения маршрутов
  • Передача состояния между маршрутами — без необходимости глобального хранилища

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

Оглавление