react脚手架中配置静态路由、动态路由、路由项

安装相关的依赖

npm i create-react-app -g 全局安装 
create-react-app --version 查看版本 
create-react-app 项目名称
cd 项目名称 进入项目 
npm i react-router-dom -D 配置路由 
npm i react-router-config -D 配置路由项
npm start 启动
npm run eject 变成自定义配置的模式

 

配置react路由

引入:src目录->index.js文件

(静态路由)使用:src目录->App.js页面入口

(动态路由)获取路径:this.props.match

配置路由项  

在src目录下创建routers文件夹->index.js文件

 

将组件引入到index.js文件中配置路由(exach:true精准匹配组件),将router暴露出去

使用:引入react-router-config文件和刚刚配置好的routers文件夹->index.js文件

启动项目查看

相关推荐
©️2020 CSDN 皮肤主题: 游动-白 设计师:白松林 返回首页