React Router v5

Почему React Router v5? React Router v4 представил новый динамический компонентный подход к маршрутизации. React Router v5 представил несколько пользовательских хуков.

Параметры URL

Параметры URL являются фундаментальным аспектом React Router и фундаментальным аспектом создания веб-приложений. В этом разделе вы разберете пример «Параметры URL» в документации по React Router v5, чтобы узнать, как эффективно использовать параметры URL в приложении React.

Вложенные маршруты

В этом разделе вы узнаете, как использовать вложенные маршруты с React Router v5.

Props

В этом разделе вы узнаете, как передавать props компонентам, отображаемым в React Router v5.

Программная навигация

При создании приложения с React Router v5 в конечном итоге вы столкнетесь с вопросом программной навигации. Из-за оттока, который прошел React Router за последние несколько лет, существует множество устаревших и откровенно некорректных учебных пособий. Цель этого раздела - выявить правильные подходы к программной навигации с помощью React Router v5.

Query Strings

В этом разделе мы рассмотрим, как реализовать и проанализировать Query Strings с помощью React Router v5.

404 страницы

В этом разделе вы узнаете, как реализовать перехват всех маршрутов для обработки 404 страниц в приложении React с React Router v5.

Ambiguous Matches

При использовании React Router v5 бывают ситуации, когда вам может понадобиться статический путь, например / settings, и динамический путь, например /: uid. Проблема в том, что / settings неоднозначна и будет соответствовать как / settings, так и /: uid. В этом разделе мы рассмотрим, как исправить проблему неоднозначных совпадений с React Router.

Передача props ссылке

В этом разделе вы узнаете, как передавать props в компонент Link React Router v5

Sidebars

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

Настройка ссылки

Поскольку React Router v5 - это просто компоненты, составить собственный компонент Link довольно просто. В этом разделе мы сделаем именно это.

(Проект) Хэш История Баскетбольной Лиги

Теперь, когда вы знаете все, что нужно знать о React Router v5, сейчас самое время применить эти знания и применить их к реальному приложению React.

Защищенные маршруты

В этом разделе вы узнаете, как создавать аутентифицированные маршруты (маршруты, к которым могут обращаться только определенные пользователи в зависимости от их статуса аутентификации) с использованием React Router v5.

Разделение кода

Разделение кода в последнее время приобрело популярность благодаря своей способности разделять приложение на отдельные пакеты, которые пользователи могут постепенно загружать. В этом разделе мы рассмотрим не только то, что такое разбиение кода и как это сделать, но также и как реализовать это с помощью React Router v5.

Конфигурация маршрута

React Router v5 отошел от подхода конфигурации маршрута к маршрутизации к подходу на основе компонентов. Однако, если вам это нужно, вы все равно можете настроить центральный маршрут с помощью React Router. В этом разделе вы узнаете как.

Предотвращение переходов

Часто при создании приложения с помощью React Router v5 вы хотите предупредить пользователя, прежде чем он уйдет от определенного маршрута. Примером этого может служить случай, когда ваш пользователь заполнил форму и затем хочет уйти с этой страницы. В этом разделе вы узнаете, как это сделать.