React JS Router — маршрутизатор

React JS Router — маршрутизатор

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

Шаг 1 — Установите маршрутизатор React Router

Простым способом установки маршрутизатора React является запуск следующего фрагмента кода в окне командной строки.

Настройте файл .babelrc в корне проекта, как показано ниже:

Добавьте следующий код в файл .babelrc

Создайте файл index.html в корневом каталоге и добавьте в него следующий код:

Чтобы настроить файл webpack.config.js, добавьте в webpack.config.js следующий код:

Шаг 2 — Добавьте маршрутизатор

Теперь мы добавим маршруты в приложение. Вместо рендеринга элемента App, как в предыдущем примере, создайте папку с именем App и в ней файлы — main.js и App.js

main.js

App.js

Шаг 3 — Создание компонентов

На этом этапе мы создадим в каталоге App два компонента: (Home) и (Login).

Home.js

Login.js

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

Источник: https://www.tutorialspoint.com/

Редакция: Команда webformyself.

FullStack-Мастер

FullStack-Мастер. Разработка CRM-системы на Node.js, Express, Angular 6

Научиться

Метки:

Похожие статьи:

Комментарии Вконтакте:

Комментарии Facebook:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">

Я не робот.

Spam Protection by WP-SpamFree