Basic Navigation
You can read full guide and tutorial here
Components in React Router
BrowserRouter
BrowserRouter is main component to cover all React application to make it routable.
- Used for applications with a modern browser that supports the HTML5 history API.
- Allows you to use regular URLs (e.g.,
/about) for navigation.
import { BrowserRouter, Routes} from 'react-router-dom';
<BrowserRouter>
<Routes>
...
</Routes>
</BrowserRouter>Route
-
Used to declare a route and specify the component to render when the route matches the current location.
-
path: Specifies the URL path for the route. -
component: Specifies the React component to render when the route is matched.
import { Route } from 'react-router-dom';
<Route path="/about" component={About} />
Reference : https://medium.com/@pratya.yeekhaday/reactjs-ทบทวน-react-router-dom-v6-สำหรับ-typescript-ec1b7e3427b7