react-router-dom@6的基礎使用

1、安裝依賴

npm i react-router-dom

默認安裝最新版本的

2、在src/router/index.js

import { createBrowserRouter } from "react-router-dom"/* createBrowserRouter：[/home]--h5路由createHashRouter：[/#/home]--哈希路由*/const router=createBrowserRouter([{path:"/login",element:<div>登錄頁</div>},{path:"/",element:<div>首頁</div>},{path:"/mine",element:<div>我的</div>},{path:"*",element:<div>404</div>}
])// element里可以替換成自己寫的組件export default router

3、在src/index.js

import React from 'react';
import ReactDOM from 'react-dom/client';import { RouterProvider } from "react-router-dom"import router from "./router/index.js"const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<RouterProvider router={router} />
);