react 和 redux（上）

react 侧重于 view，我们提到 react 就会想起 redux 这个状态管理库（工具），是的 react redux 和 rxjs 着三者结合使用 power 无比，看一看?netflix 是他们结合起来用的风生水起。我们今天详情详情一下这个精巧的 redux，第一次接触 redux 感觉不就是观察者模式的实现，学了学，用了用感觉没那么简单，我尝试解释一下吧。

一切从场景出发，这是一个很常见的场景，填写表单（一条待办），提交表单，而后在代办列表中多一条待办记录。这就是仅次于 helloworld 的 todoList 或者事 todo app。

看一看我们使用 redux 是如何实现这个过程的。这里理解一下 redux 几个重要组成部分 action reducer store 吧

分析一下，填写完表单我们会单击【提交】按钮，这是我们 view 发出一个 action 这个 action 需要包含两个信息，第一个是触发什么事件，也就是事件类型（type），是提交事件呀还是渲染列表事件呀。第二个信息就是数据（payload），我们提交表单必定会有表单数据，就会触发（发出） action ，而后

Reducer （接受action）就是会根据 action 的类型（什么事件） 来升级 state ，他不是更改现有 state 而是将 state 复制出一份，而后这个state 上进行更改，返回一个新的版本的 state，State 升级了，store 就会升级视图，完成一次操作

上代码

定义一下 action 的 type（类型）就是 action 做了什么事，说明客户做了什么操作，这样做的好处不言而喻

而后我们定义 action 返回一个对象包含两个信息，一个就是这个动作做了什么，在 type 中定义，而后 payload 升级的数据

定义 action，我们就来创立一个 reducer 解决 action 根据 action的type进行不同的解决，而后升级 action 要升级的 state

最后创立我们 store store 需要 reducer 同样我们也可以增加少量中间件