Skip to content

Роутер

Virentia Router — это семейство моделей роутов для приложений на @virentia/core и @virentia/react.

Документация сгруппирована по слою, с которым вы работаете:

  • Core — роутинг, не зависящий от фреймворка: шаблоны путей, модели роутов, роутер, навигация, отслеживание query и виртуальные роуты.
  • React — отрисовка открытых роутов в дереве React DOM.
  • React Native — отрисовка открытых роутов через React Navigation.

Внутри ядра каждая часть задокументирована отдельно, чтобы настройка, правила роутинга, обновления URL и отрисовка не схлопывались в один пример: шаблон пути описывает, как URL парсится и собирается; роут — это модель Virentia для одного адресуемого состояния; роутер регистрирует роуты, владеет сопоставлением URL и подключается к history; навигация — это граница-команда, которая открывает роуты или пишет URL; а отслеживание query превращает состояние query в URL в события модели. Слои React и React Native только отрисовывают уже открытые модели роутов.

Пакеты

ПакетНазначение
@virentia/router-pathsТипизированные шаблоны путей, парсинг, сборка и конвертация в Express
@virentia/routerРоуты, роутеры, history-адаптеры, отслеживание query, виртуальные роуты, группы, chain-роуты
@virentia/router-reactRouterProvider, Link, представления роутов, ленивые представления, outlet'ы, хуки
@virentia/router-react-nativeStack- и bottom-tabs-навигаторы, связывающие представления роутов с React Navigation

Установка

sh
pnpm add @virentia/core @virentia/router @virentia/router-paths
pnpm add @virentia/react @virentia/router-react react
pnpm add history

Пакет роутера принимает history-адаптеры, но не создает браузерную history или history в памяти внутри себя. Созданием history владеет приложение.

Страницы

Core (@virentia/router + @virentia/router-paths):

React (@virentia/router-react):

React Native (@virentia/router-react-native):

Прочее: