7.5 KiB
Улучшение маршрутизации
Инструкции
Теперь, когда вы создали базовую систему маршрутизации, пришло время улучшить её, добавив профессиональные функции, которые повысят удобство использования и предоставят лучшие инструменты для разработчиков. Реальные приложения требуют не только переключения шаблонов \u2013 им нужны динамические заголовки страниц, хуки жизненного цикла и расширяемая архитектура.
В этом задании вы расширите свою реализацию маршрутизации двумя важными функциями, которые часто встречаются в веб-приложениях, используемых в производстве. Эти улучшения сделают ваше банковское приложение более профессиональным и создадут основу для будущих возможностей.
В объявлении маршрутов сейчас содержится только идентификатор шаблона для использования. Но при отображении новой страницы иногда требуется немного больше. Давайте улучшим нашу реализацию маршрутизации, добавив две дополнительные функции:
Функция 1: Динамические заголовки страниц
Цель: Назначить заголовки каждому шаблону и обновлять заголовок окна с этим новым заголовком при изменении шаблона.
Почему это важно:
- Улучшает пользовательский опыт, показывая описательные заголовки вкладок браузера
- Повышает доступность для экранных читалок и вспомогательных технологий
- Обеспечивает лучшее контекстное понимание закладок и истории браузера
- Соответствует профессиональным стандартам веб-разработки
Подход к реализации:
- Расширить объект маршрутов, добавив информацию о заголовке для каждого маршрута
- Изменить функцию
updateRoute(), чтобы динамически обновлятьdocument.title - Проверить, что заголовки корректно меняются при переходе между экранами
Функция 2: Хуки жизненного цикла маршрута
Цель: Добавить возможность выполнения кода после изменения шаблона. Мы хотим выводить 'Dashboard is shown' в консоль разработчика каждый раз, когда отображается страница панели управления.
Почему это важно:
- Позволяет выполнять пользовательскую логику при загрузке определённых маршрутов
- Обеспечивает хуки для аналитики, логирования или инициализационного кода
- Создаёт основу для более сложного поведения маршрутов
- Демонстрирует использование паттерна наблюдателя в веб-разработке
Подход к реализации:
- Добавить необязательное свойство функции обратного вызова в конфигурацию маршрутов
- Выполнять функцию обратного вызова (если она определена) после завершения рендеринга шаблона
- Убедиться, что функция работает для любого маршрута с определённой обратной функцией
- Проверить, что сообщение в консоли появляется при переходе на страницу панели управления
Критерии оценки
| Критерий | Превосходно | Удовлетворительно | Требует улучшения |
|---|---|---|---|
Обе функции реализованы и работают. Заголовок и добавление кода также работают для нового маршрута, добавленного в объявление routes. |
Обе функции работают, но их поведение жёстко запрограммировано и не настраивается через объявление routes. Добавление третьего маршрута с заголовком и добавлением кода не работает или работает частично. |
Одна из функций отсутствует или работает некорректно. |
Отказ от ответственности:
Этот документ был переведен с использованием сервиса автоматического перевода Co-op Translator. Хотя мы стремимся к точности, пожалуйста, учитывайте, что автоматические переводы могут содержать ошибки или неточности. Оригинальный документ на его родном языке следует считать авторитетным источником. Для получения критически важной информации рекомендуется профессиональный перевод человеком. Мы не несем ответственности за любые недоразумения или неправильные интерпретации, возникающие в результате использования данного перевода.