reactrouter官方文档_前端日常之react的hook+路由独立配置

近来项目比较少&＃xff0c;工作量不大&＃xff0c;早就听说reac更新了hook&＃xff1b;开始提倡函数式写法&＃xff0c;vue的新版本更新也遵循这一原则&＃xff0c;采取向下兼容的方式&＃xff0c;同样支持原有的class组件写法&＃xff1b;以上原因有两点(个人观点&＃xff0c;不喜勿喷)&＃xff0c;其一是据说react官方开发者本身比较偏向函数式&＃xff0c;其二是开发者在框架源码中做了很多性能优化&＃xff0c;但是由于class组件&＃xff0c;有些优化并没作用于开发过程。

最近开始试一波react的坑&＃xff0c;开始慢配置项目的目录结构&＃xff0c;发现它的路由没有像vue一样作为单独文件配置&＃xff0c;而是以jsx方式呈现&＃xff1b;于是我开始在github上查找关于react独立路由文件的方法,果然我找到了 React Router Config&＃xff1b;&＃61;》

$ npm install --save react-router-config

于是我开始对照文档以及大神的博客构建项目&＃xff0c;项目目录如下&＃xff1a;

路由文件&＃xff1a;routes.js

import Home from &＃39;../pages/home&＃39;import Demo from &＃39;../pages/demo&＃39;import Test from &＃39;../pages/test&＃39;// import App from &＃39;../App&＃39;const routes &＃61; [ { path:&＃39;/home&＃39;, component:Home, name:"home