Задать вопрос
  • Почему не работает react-router-dom?

    страница попросту ничего не показывает, чисто белый фон

    В подобных ситуациях ещё неплохо бы в консоль заглядывать.
    Там ошибки могут вываливаться.

    Ошибки, которые заметил

    Ошибка №1:
    Из библиотеки `react-router-dom` импортируется не `Router`, а `BrowserRouter`
    Но для удобства его можно импортировать, переименовав в `Router`
    Как у Вас:
    import {Router,Route} from 'react-router-dom';
    Как должно быть
    import { BrowserRouter as Router, Routes, Route } from "react-router-dom";


    Ошибка №2
    Компоненты `Route` нужно помещать внутрь компонента `Routes`
    Сначала его нужно импортировать
    import { BrowserRouter as Router, Routes, Route } from "react-router-dom";

    Потом в него нужно вложить компоненты `Route`
    function App() {
      return (
        <Router>
          <Routes>
            <Route path="/" element={<Home/>}/>
          <Routes/>
        </Router>
      );
    }


    Ошибка №3
    В компоненте `Route` нужно указывать атрибут/проп не `component`, а `element`
    Как у Вас:
    <Route path='/Dialogs' component={</Dialogs>} />
    Как должно быть:
    <Route path="/dialogs" element={Dialogs}/>
    Ответ написан
    4 комментария