Когда нажимаю на ссылку, адресная строка меняется но страница на которую я перешёл полностью пустая или же не переходит. Не могу понять в чём проблема. Вот как выглядит адресная строка
localhost:3000/subscription/Mounth
Root.jsx
import { Route, Routes } from "react-router-dom"
import Layout from "../Layout/Layout"
import Main from "../Main/main"
import Subscription from "../Subscription/subscription"
import Mounth from "../Subscription/Mounth"
function Root(){
return(
<>
<Routes>
<Route path="/" element={<Layout/>}>
<Route path="/" element={<Main/>}/>
<Route path="subscription" element={<Subscription/>}/>
<Route path="SubscriptionSettingoneMounth" element={<SubscriptionSettingoneMounth/>}/>
</Route>
</Routes>
</>
)
}
export default Root
Index.js
import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import { BrowserRouter as Router } from 'react-router-dom';
import Root from './Components/Root/root';
import './Components/assets/css/style.min.css'
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
<Router>
<Root/>
</Router>
);
Layout.jsx
import { Outlet } from "react-router-dom"
import Footer from "../Footer/Foote"
import Navbar from "../Navbar/navbar"
function Layout(){
return(
<div className="content-wrapper">
<Navbar/>
<Outlet/>
<Footer/>
</div>
)
}
export default Layout