Почему всегда рендериться компонент даже если path = «*», react-router-dom?

Question

[bzotsss]

Всем привет , хотел бы узнать почему всегда рендериться реакт компонент , хотя в патче указан путь * , тобеж url линки на который не существует . И как мне сделать ре-рендер на не существующие url ? "react-router-dom": "^5.3.0"
Вот код :

import s from "./App.module.css";
import routesConfig from "../../routes/routesConfig";
import { NavLink, Route, BrowserRouter, Switch } from "react-router-dom";
import Header from "@components/Header/Header";
import PersonPage from "../PersonPage/PersonPage";
import NotFoundPage from "../NotFoundPage/NotFoundPage";

const App = () => {
  return (
    <div className={s.wrapper}>
      <BrowserRouter>
        <Route component={Header} />
        <Switch>
          {routesConfig.map((route) => { // тут у нас массив с инофой для роутеров
            return (
              <Route
                path={route.path}
                exact={route.exact} // exact означает точное совпадение
                component={route.component}
              />
            );
          })}
        </Switch>
        <Route path="*" exact component={NotFoundPage} />
      </BrowserRouter>
    </div>
  );
};

export default App;

Answer 1

[Alexandroppolus]

Просто запихни этот роут внутрь Switch

Comments

[bzotsss]

Спасибо!