学习mvc到Flux框架我们先了解
flux 背景：React.js 和Angular.js对比：React.js 是一个视图层的类库lib,我们可以把它当作模版引擎使用，输出html，但是我们无法单独用它输出一个完整的app，而angular的定位是一个框架(framework)。angular自带模板引擎，路由引擎，有健全的数据双向绑定机制，内置Ajax请求功能，还能够定义Model。而React.js类库只能用于定义视图组件。为了补react.js 自身的缺点，后来引入了Flux框架。
哪有人会问 flux跟MVC有什么关系呢？ 接下来我们通过分析MVC、flux的设计原理找到他们的关系。
MVC：
理解MVC ： https://blog.csdn.net/bobo89455100/article/details/61623242
MVC 模式代表 Model-View-Controller（模型-视图-控制器） 模式。这种模式用于应用程序的分层开发。
原理图：
demo事例：
有图可以看出： controller和model是双向交互数据的
MVC优点:是使用 controller将view和model 分离，实现解耦。
MVC缺点: 代码抽象、要创建多个文件夹，着重大型项目使用，除此之外就是 controller和model的交互数据流是双向的，不能保证数据的安全性。因此出现了Flux.
Flux架构：
原理图：
总结原理图：
1、主要由三个部分组成：
action：对事件进行描述以及处理参数传递，驱动dispatcher
Dispatcher: 实现对是行为的派发
store： 储存数据 处理原始数据 继承eventEmitter 实现
2、
优点：
由上图可以看出 flux跟MVC的原理优点相似，目的都是将视图和数据分离开，但是flux采用的束流流向是单向的。上层不会过多的处理数据内容，保证数据的唯一性。
缺点：
一个应用可以拥有多个store，多个store直接可能有依赖关系（相互引用）；
Store封装了数据和处理数据的逻辑。
每个项目不一定都是将flux源码原封不动拿来用，我们1期的项目是直接拿的flux的源码，二期根据它的思想写成systemBus 程序一初始化，将所有需要回调的事件全部注册在这个systemBus里（说白了就是上车）支持hook 中间件操作。
flux demo git地址：https://github.com/Gallagher1126/flux-demo.git
2期是擦考flux的设计理念写的 ，后期会上传！
实现原理：
1、继承于store的管理类，使用store里的register实现注册 将带有一个action参数的回调函数传入dispatcher的register
2、发送登录action ，使用dispatcher去像每个注册的管理类发消息
3、每个管理类收到停止如果是自己关心的类型就去执行响应的操作，完成操作后执行回调函数返回数据或者结果。
网友评论