Skip to main content
added 110 characters in body
Source Link

You can use

<Route path="*" element={ <Navigate to="/404" replace />} />

this way you have a redirection and a url replacement

for example :

import React from 'react'
import { BrowserRouter as Router, Routes , Route, Navigate } from 'react-router-dom'
import Home from '../../pages/Home'
import Account from '../../pages/Account'
import Contact from '../../pages/Contact'
import NotFound  from '../../pages/NotFound'


const AllRoutes= () => {
    return(
        <Router>
            <Routes>
                <Route path="/" element={ <Home /> } />
                <Route path="/Account" element={ <Account /> } />
                <Route path="/Contact" element={ <Contact /> } />
                <Route path="/404" element={ <NotFound /> } />
                <Route path="*" element={ <Navigate to="/404" replace />} />
            </Routes>
        </Router>
    )
}

export default AllRoutes

You can use

<Route path="*" element={ <Navigate to="/404" replace />} />

this way you have a redirection and a url replacement

for example :

import React from 'react'
import { BrowserRouter as Router, Routes , Route, Navigate } from 'react-router-dom'
import Home from '../../pages/Home'
import Account from '../../pages/Account'
import Contact from '../../pages/Contact'


const AllRoutes= () => {
    return(
        <Router>
            <Routes>
                <Route path="/" element={ <Home /> } />
                <Route path="/Account" element={ <Account /> } />
                <Route path="/Contact" element={ <Contact /> } />
                <Route path="*" element={ <Navigate to="/404" replace />} />
            </Routes>
        </Router>
    )
}

export default AllRoutes

You can use

<Route path="*" element={ <Navigate to="/404" replace />} />

this way you have a redirection and a url replacement

for example :

import React from 'react'
import { BrowserRouter as Router, Routes , Route, Navigate } from 'react-router-dom'
import Home from '../../pages/Home'
import Account from '../../pages/Account'
import Contact from '../../pages/Contact'
import NotFound  from '../../pages/NotFound'


const AllRoutes= () => {
    return(
        <Router>
            <Routes>
                <Route path="/" element={ <Home /> } />
                <Route path="/Account" element={ <Account /> } />
                <Route path="/Contact" element={ <Contact /> } />
                <Route path="/404" element={ <NotFound /> } />
                <Route path="*" element={ <Navigate to="/404" replace />} />
            </Routes>
        </Router>
    )
}

export default AllRoutes
Source Link

You can use

<Route path="*" element={ <Navigate to="/404" replace />} />

this way you have a redirection and a url replacement

for example :

import React from 'react'
import { BrowserRouter as Router, Routes , Route, Navigate } from 'react-router-dom'
import Home from '../../pages/Home'
import Account from '../../pages/Account'
import Contact from '../../pages/Contact'


const AllRoutes= () => {
    return(
        <Router>
            <Routes>
                <Route path="/" element={ <Home /> } />
                <Route path="/Account" element={ <Account /> } />
                <Route path="/Contact" element={ <Contact /> } />
                <Route path="*" element={ <Navigate to="/404" replace />} />
            </Routes>
        </Router>
    )
}

export default AllRoutes