flux和redux

数据流：

1.数据流是行为和响应的抽象.

2.react使用的是单数据流的方式.

action：行为和动作

controller:控制器

model:模型

view:视图

单机事件会调用一个方法，单机就是行为，action就是响应，代码就是controller,

flux介绍：

1.Flux是一种架构思想，专门解决软件的结构问题，它跟MVC架构是同一类东西，但是更加简单和清晰.

2.首先，Flux将一个应用分成四个部分：

(1)View:视图层

(2)Action(动作):视图层发出的消息(比如mouseClick)

(3)Dispatcher(派发器):用来接收Actions、执行回调函数.

(4)Store(数据层):用来存放应用的状态，一旦发生变动，就提醒Views要更新页面.

redux介绍：

redux介绍：

1.redux和flux非常相似，是flux的一个实现方法，但是还存在一些差异.

(1) Web应用是一个状态机，视图与状态是一 一对应的。所有的状态，保存在一个对象里面.

原理：

1.当用户触发了UI里的action时，action将被送到reducer方法里.

2.reducer就会更新数据层.

3.react数据也就是state(state包含在store里).

4.state再去渲染UI.

Redux可以用这三个基本原则来描述：

1.单一数据源

整个应用的state被储存在一棵object tree中，并且这个object tree只存在于唯一 一个store中.

2.State是只读的

唯一改变state的方法就是触发action，action是一个用于描述已发生事件的普通对象.

3.使用纯函数来执行修改

为了描述action如何改变staet tree,你需要编写reducers.

redux实用场景：

1.多交互，多数据源。

(1)用户的使用方式复杂.

(2)不同身份的用户有不同的使用方式(比如普通用户和管理员)

(3)多个用户之间可以协作.

(4)与服务器大量交互，或者使用了WebSocket

(5)View要从多个来源获取数据

2.从组件角度

(1)某个组件的状态，需要共享.

(2)某个状态需要在任何地方都可以拿到.

(3)一个组件需要改变全局状态.

(4)一个组件需要改变另一个组件的状态.

方法详细讲解-store

1.redux 主要由三部分组成：store、reducer、action

2.store是一个对象，有四个主要方法：

(1)dispatch:用于action的派发——在createStore中可以用middleware中间件对dispatch进行改造，比如action传入dispatch会立即触发reducer，有些时候我们不希望它立即触发，而是等待异步操作完成之后再触发，这时候用redux-thunk对dispatch进行改造，以前只能传入一个对象，改造完成后可以传入一个函数，在这个函数里我们手动dispatch一个action对象，这个过程是可控的，就实现了异步.

(2)subscribe：监听state的变化——这个函数再store调用dispatch时会注册一个listener监听state变化，当我们需要知道state是否变化时可以调用，它返回一个函数，调用这个返回的函数可以注销监听.

(3)getState:获取store中的state——当我们用action触发reducer改变了state时，需要再拿到新的state里的数据，毕竟数据才是我们想要的。getState主要在两个地方需要用到，一是在dispatch拿到action后store需要用它来获取state里的数据，并把这个数据传给reducer,这个过程是自动执行的，二是在我们利用subscribe监听到state发生变化后调用它来获取新的state数据，如果做到这一步，说明我们已经成功了.

(4)replaceReducer:替换reducer，改变state修改的逻辑.

3.action：

action是一个对象，其中type属性是必须的，同时可以传入一些数据，action可以用actionCreator进行创造，dispatch就是把action对象发送出去.

4.reducer:

(1)reducer是一个函数，它接受一个state和一个action，根据action的type返回一个新的state，根据业务逻辑可以分为很多个renducer，然后通过combineReducers将它们合并，state树中有很多对象，每个state对象对应一个reducer，state对象的名字可以在合并时定义.