react+reudx+webpack结合开发流程简述
先为大家介绍下redux。redux是flux的具体实现，可以把redux理解为一个管理数据的框架。而整个redux管理的数据都存在一个名为state的数组当中（可以是一个n维数组，具体维数看具体项目复杂程度），redux为了管理这个state数组封装了一系列的方法，因此，state数组+state数组的管理方法 = redux。以下是一个redux的流程简图：
上图的UI对应我们所使用react，UI的展现又由state决定，所以整个流程最核心的内容就是对sate进行增删改查。上具体项目目录结构：
1、store：redux是一个管理数据的框架，而store便是存放redux的state与一些方法的地方
2、components与containers：react中的一个个容器
3、actions：由此触发redux的dispatch()找到对应reducer，对state进行修改
4、reducer：修改state的地方
5、middleware：顾名思义，dispatch与reducer的中间件，异步（ajax/fetch）与服务端发生响应便是在此
6、index.js：webpack编译入口
加上中间件的redux的流程图如下：
我们实际开发过程中，仅有前端view视图是没有任何意义的，因此在middleware中与服务端交互获取state的数据源是必须要做的事情。
实际开发过程中的流程变成：
view -> action -> middleware （ajax/fetch获取服务端数据） -> dispatch() -> reducer -> state -> view
以上便是react+redux的开发流程，工欲善其事必先利其器，理解了工作原理再来应用于实际代码中学习起来变可事半功倍，
具体的代码实现会在下一个博客中讲解。
以上是 react+reudx+webpack结合开发流程简述 的全部内容， 来源链接： utcz.com/z/382658.html
