В чем принцип работы React Router

Ответ

React Router — это библиотека для маршрутизации в React-приложениях. Она позволяет динамически менять содержимое страницы без перезагрузки (SPA-подход).

Основные компоненты:

  • BrowserRouter — обертка для работы с HTML5 History API.
  • Routes — контейнер для маршрутов.
  • Route — определяет, какой компонент отображать по пути (path).
  • Link и NavLink — навигационные ссылки (без перезагрузки).

Пример:

import { BrowserRouter, Routes, Route, Link } from 'react-router-dom';

function App() {
  return (
    <BrowserRouter>
      <nav>
        <Link to="/">Home</Link>
        <Link to="/about">About</Link>
      </nav>
      <Routes>
        <Route path="/" element={<Home />} />
        <Route path="/about" element={<About />} />
      </Routes>
    </BrowserRouter>
  );
}

Как работает:
При клике на Link URL меняется, React Router сверяет путь с Route и рендерит соответствующий компонент. Всё происходит на клиенте без запросов к серверу.