天天看点

react实战之cnode—02视图划分及路由基本配置

1.视图划分

我们首先看一下cnode的官网

react实战之cnode—02视图划分及路由基本配置

 经过分析之后发现可以划分为五个模块:首页,教程,文章详情,用户信息,关于。

所以我们再项目中添加以下代码

react实战之cnode—02视图划分及路由基本配置

2.路由基本配置

首先配置好路由,编写以下代码

react实战之cnode—02视图划分及路由基本配置

然后我们进入入口文件

react实战之cnode—02视图划分及路由基本配置

接着修改App.js文件代码

react实战之cnode—02视图划分及路由基本配置

运行项目的时候,报错了

react实战之cnode—02视图划分及路由基本配置

 在网上找到了解决方案

https://segmentfault.com/q/1010000017794269/a-1020000017860037

react实战之cnode—02视图划分及路由基本配置

我这么懒,当然是选择后者了,hahahhahahaha 

npm start跑是跑起来,但是不跳转。查看控制台

react实战之cnode—02视图划分及路由基本配置

打开控制台,该有的都有了,下一节组件完善了看还存不存在这个问题吧。~~~~(>_<)~~~~