create-reac-app搭建项目框架(第二部分)

上部分说的是最简单的创建react项目。这里依然以上项目骨架为基础，增加布局的开发。

我是这样考虑的。把项目分成两个大的布局。一个是登录、注册、忘记密码的外层布局，和基于antd的layout做成的内层布局。

如图，忘记密码和注册和这个页面几乎一样，就不贴图了。

在登录成功后，会跳转到内层布局。因为之前一直再用vue，使用react开发在这一块真的饶了太久了，最后还是看了很多方法才解决的。下面看下项目的结构

先看路由文件的内容，上面有引入文件的写法，截图就没有放上去了。

现在再来看看Layout这个文件立，里面的写法

我踩的第一个坑就在这里，最开始我用的是函数式组件。结果这里不知道怎么写，因为没有this.props.children的写法，最后换成类组件这样写才把页面加载到这里。真是摸着石头过河，也算是让自己学到些东西了。

最后就是入口文件了

要记得在最外层加上这个组件，因为antd默认是英文模式，使用这个可以改成中文模式。