React 路由可以通过 react-router-dom 库实现。以下是一个简单的路由配置示例:
- 安装
react-router-dom库
npm install react-router-dom
- 在项目中创建路由组件
在 src 目录下创建一个名为 routes.js 的文件,并编写路由配置:
import React from 'react'; import { BrowserRouter as Router } from 'react-router-dom'; import Routes from './routes'; const App = () => ( <Router> <Routes /> </Router> ); export default App;
以上路由配置示例中,我们定义了三个路由:
/显示Home组件/about显示About组件/contact显示Contact组件
当用户访问 /、/about 或 /contact 时,Routes 组件会渲染对应的组件。同时,在 Routes 组件中使用了 Switch 和 Route 组件来实现路由匹配和渲染。