Переход по ссылкам без обновления страницы

Переходить по ссылкам без обновления текущей страницы можно через библиотеку react-router-dom.

Для начала надо установить библиотеку:

npm i react-router-dom

Пример кода:

// index.js
import ReactDOM from 'react-dom/client';
import {createBrowserRouter, RouterProvider} from "react-router-dom";

const router = createBrowserRouter([
  {
    path: "/",
    element: <App />,
  },
  {
    path: "/contacts",
    element: <Contacts />,
  },
]);

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <RouterProvider router={router} />
);

Через createBrowserRouter() указывается, какой модуль загружается на определённой странице.

Чтобы был переход по ссылке без обновления страницы, надо использовать компонент <Link>.

import { Link } from "react-router-dom";

<Link to="/contacts">Контакты</Link>

Похожие страницы

• React
• Vue