Чтобы установить React Router, вы можете выполнить следующие действия:
-
Если вы еще не создали приложение React, начните с настройки нового проекта React с помощью create-react-app или любого другого метода, который вы предпочитаете.
-
Откройте проект в терминале или командной строке.
-
Выполните следующую команду, чтобы установить React Router с помощью npm (диспетчер пакетов узлов):
npm install react-router-domЭта команда загрузит и установит пакет React Router и его зависимости в вашем проекте.
-
После завершения установки вы можете импортировать и использовать React Router в своем приложении. Вот пример его использования в компоненте React:
import React from 'react'; import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'; function App() { return ( <Router> <Switch> <Route exact path="/" component={Home} /> <Route path="/about" component={About} /> <Route path="/contact" component={Contact} /> </Switch> </Router> ); } function Home() { return <h1>Home Page</h1>; } function About() { return <h1>About Page</h1>; } function Contact() { return <h1>Contact Page</h1>; } export default App;В этом примере мы импортируем необходимые компоненты из «react-router-dom» и определяем маршруты с помощью компонента
. Компонентгарантирует, что одновременно отображается только один маршрут. -
Теперь вы можете запустить приложение React и начать использовать React Router для навигации.