📅  最后修改于: 2023-12-03 15:09:04.997000             🧑  作者: Mango
如果你正在使用 React 构建应用程序,那么使用 react-router-dom 库可以很方便地管理和控制路由的变化。
在终端窗口中进入你的 React 项目文件夹。
运行以下命令安装 react-router-dom:
npm install react-router-dom
或者如果你使用 yarn,运行以下命令:
yarn add react-router-dom
在你的 React 应用程序中引入库:
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
在你的代码中使用 Router、Route 和 Switch 组件来管理和渲染路由。
import React from 'react';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import HomePage from './pages/HomePage';
import AboutPage from './pages/AboutPage';
import NotFoundPage from './pages/NotFoundPage';
function App() {
return (
<Router>
<Switch>
<Route exact path="/" component={HomePage} />
<Route path="/about" component={AboutPage} />
<Route path="*" component={NotFoundPage} />
</Switch>
</Router>
);
}
export default App;
运行你的应用程序,现在你就可以使用 react-router-dom 来控制你的路由了!
安装和使用 react-router-dom 库很简单,只需要遵照上述步骤即可。如果你想进一步掌握 React 和 react-router-dom,建议参考官方文档。