在刚刚接触Dva时，我最想知道的第一个问题就是：
Dva官网文档的介绍是：
dva 是体验技术部开发的 React 应用框架，将上面三个 React 工具库包装在一起，简化了 API，让开发 React 应用更加方便和快捷。
dva = React-Router + Redux + Redux-saga
说实话这些名词让我只能一个一个的百度，虽然不能说毫无收获，但是依然难以理解。 现在我的理解Dva是一个轻量化的数据流向方案。 既然说是数据流向方案，那就应该先看数据流向的流程图嘛，但是在我看到官网的流程图后，发现对于第一次接触Dva的我来说，确实无异于“天书”。
其中的单词代表的又是什么意思呢？
参考最近接触到的项目中使用的Dva流程和官网文档给出的解释，再次进行梳理。
首先，当一个页面发生一个行为，如：用户交互行为或者页面跳转时通常会发生数据的改变，此时dispatch函数会调用一个action，从而使数据发生改变。
** dispatch 函数** dispatching function 是一个用于触发 action 的函数，action 是改变 State 的唯一途径，但是它只描述了一个行为，而 dipatch 可以看作是触发这个行为的方式，而 Reducer 则是描述如何改变数据的。 常见的形式如：
dispatch({//dispatch函数具有type,payload两个参数
type: 'user/add', // type是用于找到与渲染层所连接@connet的Model层。
payload: {}, // payload中存放的是访问API所需的参数传递给Model。
});
需要注意的是 dispatch 是在组件 connect Models以后，通过 props 传入的。 const { dispatch } = this.props;
在 Dva 中，可以通过@connect组件来实现View层与Model层的绑定。 dispatch可以调用 Model 中的 Reducer 或者 Effects（对于同步行为则直接调用Reducer来改变State，如果是异步行为则先触发Effects（副作用）然后流向Reducer最终改变State）来改变State。
@connect(({ namespace,loading }) => ({//namespace为Model的一个属性用于识别Model，
其中整个页面的State是由许多Model以namespace为key合成State。
namespace,
loading
}))
以上是在页面的js文件中所需做的介绍，当dispatch调用刀Model页面时：
在接触Dva这几天，使用到了Model对象所具有以下几种属性：
（1）namespace：前面提到过相当于全局State中的key。 namespace: 'historyScoreServiceModel'
（2）state：表示 Model 当前的状态数据。
state: {
reportData: [],
workData: [],
report: '',
reportUrl:''
},
State State 表示 Model 的状态数据，通常表现为一个 javascript 对象（当然它可以是任何值）；
操作的时候每次都要当作不可变数据来对待，保证每次都是全新对象，没有引用关系，这样才能保证 State 的独立性，便于测试和追踪变化。
（3）effect：在使用过程中其中存放着dispatch所需调用的函数。在使用过程中通过yield call函数调用了server层发送Ajax请求的函数，返回的数据。call的第一个参数是你要调用的函数，第二个参数开始是你要传递的参数。然后对于返回的数据通过yield put的type属性调用调用一个方法并将获取到的State作为参数传入tpye属性所调用的函数中。
effects: {
*getHistoryScore({ payload }, { call, put }) {
const response = yield call(调用的server层的函数， 传入的参数);
console.log(response)//返回的数据
yield put({
type: 'save',//调用的save方法
payload: {
reportUrl: response
},
});
},
},
（4）reducers：用于数据合并。
在 dva 中，reducers 聚合积累的结果是当前 model 的 state 对象。通过 actions 中传入的值，与当前 reducers 中的值进行运算获得新的值（也就是新的 state）。
需要注意的是 Reducer 必须是纯函数，所以同样的输入必然得到同样的输出，它们不应该产生任何副作用。
reducers: {
save(state, { payload }) {//save函数传入两个参数一个是原State，一个是新数据，save函数用于将两者扩展合并。
return {
...state,
...payload,
};
},
},
Ajax请求是在effect中通过调用server层的函数，函数体中通过ruquest函数发送Ajax请求，从ApI获取数据。
至此，数据的获取，到拼接到State最终渲染到页面的dva的完整流程就OK了。 现在再来理解一下dva官方文档的数据流程介绍吧。
数据的改变发生通常是通过用户交互行为或者浏览器行为（如路由跳转等）触发的，当此类行为会改变数据的时候可以通过 dispatch 发起一个 action，如果是同步行为会直接通过 Reducers 改变 State ，如果是异步行为（副作用）会先触发 Effects 然后流向 Reducers 最终改变 State，所以在 dva 中，数据流向非常清晰简明，并且思路基本跟开源社区保持一致。
参考文献：
DvaJS官方文档：https://dvajs.com/guide/
