Почему react подгружает страницу?

Question

[origami]

Здравствуйте, только начинаю познавать реакт. Раньше никогда не работал с фреймворками, считал что оно мне не надо)
Вообщем, я решил учить реакт, ибо это как-минимум самый популярный фронтенд фреймворк, но больше из-за СПА модели. Делаю навбар как обычно, ul li a, но беда заключается в том, что ссылки подгружают index.html по новой после каждого клика, а мне нужно полноценное SPA приложение с бесшовной загрузкой.

Код навбара:

const Sidebar = (props) => {
    return (
        <nav className="sidebar">
            <div className="sidebar__branding">
                <a href="/">
                    <h3>AdminPanel</h3>
                </a>
            </div>
            <ul className="sidebar__links">
                <li><a href="/">Statistic</a></li>
                <li><a href="/">Collected</a></li>
                <li><a href="/">Templates</a></li>
                <li><a href="/">JS Builder</a></li>
                <li><a href="/">Telegram</a></li>
                <hr/>
                <li><a href="/">Settings</a></li>
                <li><a href="/">Subscription</a></li>
            </ul>
        </nav>
    )
}

Код index.js

render(
    <BrowserRouter>
        <Routes>
            <Route path="/" element={<PanelContainer />} />
            <Route path="/login" element={<LoginPage />} />
            <Route path="/register" element={<RegisterForm />} />
            <Route path="*" element={<Error />} />
        </Routes>
    </BrowserRouter>,
    document.getElementById("root")
);

версия реакт роутер дом

"react": "^18.1.0",
    "react-dom": "^18.1.0",
    "react-router-dom": "^6.3.0",

Вопрос конечно безумно прост и наверное ответ лежит где-то в гугле, но сформулировать вопрос под поисковик я не в силах) Вроде всё облазил, но ничего не нашел.

Answer 1

[Alexandroppolus]

используй Link вместо a, должно отпустить

Comments

[origami]

Спс!!