基本使用
安装命令
npm install react-router-dom
yarn add react-router-dom
引入使用
首先创建index.config.tsx / jsx组件 ,引入下面代码:
【注意】:必须创建tsx 或 jsx 文件否则会报错
import * as React from 'react'; import type { RouteObject } from "react-router-dom"; const Login =React.lazy(()=>import('../components/login/index')) const constantRouteMap: RouteObject[] = [ { path: '/', element: <Login />, } ] export default constantRouteMap;
在index.config.tsx / jsx文件下创建index.ts / js文件,引入一下代码:
import { useRoutes } from 'react-router-dom' import constantRouteMap from './index.config' const RouterView = () => useRoutes(constantRouteMap) export default RouterView
App.tsx文件
import * as React from 'react'; import { BrowserRouter } from 'react-router-dom'; import RootRoutes from './router/index'; import "./assets/css/base.scss" import { Provider } from 'react-redux'; import Store from './redux/store' const App: React.FC = () => ( <Provider store={Store}> <BrowserRouter> <RootRoutes/> </BrowserRouter> </Provider> ); export default App;