react路由配置

最新推荐文章于 2024-03-11 23:45:39 发布

VIP文章晕fufufu

最新推荐文章于 2024-03-11 23:45:39 发布

阅读量2.7k

点赞数

分类专栏： react 文章标签： react.js javascript 前端

本文链接：https://blog.csdn.net/Paolooo/article/details/125085961

版权

react路由配置
        1 安装react-router-dom 5.2.0 或者5.2.1
          npm i react-router-dom --save-dev
        2 在项目中创建router.js文件
          import { BrowserRouter, Route } from 'react-router-dom';

          class Router extends React.Component{
            render() {
              return (
                <BrowserRouter>
                  <Route exact path="/路径" component={路由组件}></Route>
                  <Route strict exact path="/路径/:自定义属性名" component={路由组件}></Route>   // 动态路由匹配   /路径/123  /路径/name
                </BrowserRouter>
              )
            }
          }

          exact 为严格模式 
          strict 精确匹配

          export default Router

      3 在index.js文件中 引入 Router
        import Router from './Router'

        <React.StrictMode>
          <Router />
        </React.StrictMode>

        注意：
          在react-router-dom中有Link标签