React-router komponentleri yüklemiyor
import HeaderComp from "./components/HeaderComp";
import { Switch, Route, BrowserRouter } from 'react-router-dom';
import MainPage from "./components/MainPage";
import HelpPage from "./components/HelpPage";
import DownloadPage from "./components/DownloadPage";
import SearchPage from "./components/SearchPage";
import DonatePage from "./components/DonatePage";
function App() {
return (
<div>
<HeaderComp />
<main>
<div>
<BrowserRouter>
<Switch>
<Route path="/" exact>
<MainPage />
</Route>
<Route path="/download" exact>
<DownloadPage />
</Route>
<Route path="/search" exact>
<SearchPage />
</Route>
<Route path="/help" exact>
<HelpPage />
</Route>
<Route path="/donate" exact>
<DonatePage />
</Route>
</Switch>
</BrowserRouter>
</div>
</main>
</div>
);
}
export default App;
Kodlarım bu şekilde, urlyi yazınca sorun yok komponent yükleniyor fakat headerdaki navlinklere tıklayınca yüklenmiyor
Soru hatalı mı? 👎
Eğer sorunun kurallara aykırı olduğunu düşünüyorsanız lütfen bize bildirin!
Cevaplar (1)
Header BrowserRouter içinde olmadığı için olabilir bir de alttaki gibi denermisin.
import HeaderComp from "./components/HeaderComp";
import { Switch, Route, BrowserRouter } from 'react-router-dom';
import MainPage from "./components/MainPage";
import HelpPage from "./components/HelpPage";
import DownloadPage from "./components/DownloadPage";
import SearchPage from "./components/SearchPage";
import DonatePage from "./components/DonatePage";
function App() {
return (
<BrowserRouter>
<div>
<HeaderComp />
<main>
<div>
<Switch>
<Route path="/" exact>
<MainPage />
</Route>
<Route path="/download" exact>
<DownloadPage />
</Route>
<Route path="/search" exact>
<SearchPage />
</Route>
<Route path="/help" exact>
<HelpPage />
</Route>
<Route path="/donate" exact>
<DonatePage />
</Route>
</Switch>
</div>
</main>
</div>
</BrowserRouter>
);
}
export default App;