React Router

Đầu tiên chúng ta cần cài đặt React Router DOM vơi lệnh 

npm i react-router-dom

Tiếp theo chúng ta sẽ code file src/main.tsx

import React from 'react'
import ReactDOM from 'react-dom/client'
import App from './App'
import './index.css'
import {BrowserRouter, Route, Routes} from "react-router-dom";
import Home from "./pages/home";
import About from "./pages/about";

ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
  <React.StrictMode>
      <BrowserRouter>
          <Routes>
              <Route path='/' element={<App />}></Route>
              <Route path='/home' element={<Home />}/>
              <Route path='/about' element={<About />}/>
          </Routes>

      </BrowserRouter>

  </React.StrictMode>,
)

file src/App.tsx

import { useState } from 'react'
import reactLogo from './assets/react.svg'
import './App.css'
import {Link} from "react-router-dom";

function App() {
  const [count, setCount] = useState(0)

  return (<>
        <div className='link_to_path'>
            <Link to='/home'>Home</Link>
            <br/>
            <Link to='/about'>About</Link>
        </div>
    </>
  )
}

export default App

Tiếp theo src/pages/home.tsx

import React from "react";
import {Link} from "react-router-dom";
const Home = () => {
  return(
      <>
        <Link to='/about' >ABout</Link>
        <Link to='/' >Trang chủ</Link>
      </>
  )
}
export default Home;

file src/pages/about.tsx

import React from "react";
import {Link} from "react-router-dom";
const About = () => {
  return(
      <>
        <Link to='/home' >Home</Link>
        <Link to='/' >Trang chủ</Link>
      </>
  )
}
export default About;

Thế là xong demo