Dva入门学习
(划分结构&)
划分结构&
(设计Model&)
设计Model&
数据维度抽离，抽离数据本身及相关操作的方法，model只关心数据本身，遇到的状态管理等信息跟 model 无关，而是作为组件自身的state维护
业务维度model设计
(组件设计方法&)
组件设计方法&
路由组件
纯组件
所需要的数据通过props传递到组件内部
每个组件跟业务数据并没有耦合关系，只是完成自己独立的任务，需要的数据通过 props 传递进来，需要操作的行为通过接口暴露出去。
而 Container Component 更像是状态管理器，它表现为一个容器，订阅子组件需要的数据，组织子组件的交互逻辑和展示。
(container vs component? &)
container vs component? &
对于我来说，容器是路由的处理程序,它还为该路由获取redux的状态
(组件设计实践&)
组件设计实践&
项目配置路由，路由通常指的是前端路由，由于我们的应用现在通常是单页应用，所以需要前端代码来控制路由逻辑
设计路由组件
Users Container 的表现为 Route Components（这也是 dva 推荐的结构划分），可以理解页面维度的容器
自顶向下的设计方法
定义组件的三种方式
Userlist组件完善
无状态组件(Stateless Component)
添加静态数据
抽取静态数据
(添加reducers&)
添加reducers&
reducers 主要负责修改 model 的数据（state）
model 的数据就是通过我们分离出来的 reducer 创建出来的
给 Users Model 添加 Reducers,根据新的数据来修改本身的 state，这就是 reducers 要做的事情。
合适的时机（进入 /users/ ）发起（dispatch）了一个 action，修改了 model 的数据，并且通过 Container Components 关联了 model，通过 props 传递到 Presentation Components，组件成功显示。
通过调用 'users/query/success' 这个 reducer，我们就可以将 Users Model 的数据变成静态数据，调用这个 reducer需要关联Model
mapStateToProps({ users }) ，return {users}; 讲Model中的namespace绑定到Component中
在订阅了数据以后，就可以通过 props 访问到 model 的数据了，而 UserList 展示组件的数据，也是 Container Component 通过 props 传递的过来的。
userListProps={dataSource:list}是一个对象，不是解构赋值。
List是Model中state里的值
UserList获取父组件传递下来的dataSource，在Table上注入属性
原先的state是写在父组件中的
(发起Actions&)
发起Actions&
表达的概念是发起一个修改数据的行为，主要的作用是传递信息：
需要注意的是：action的名称（type）如果是在 model 以外调用需要添加 namespace。
除了 type 以外，其它对象中的参数随意定义，都可以在对应的 reducers（effects）中获取，从而实现消息传递，将最新的数据传递过去更新 model 的数据（state）。
在本例中获取用户数据信息的时机就是访问 /users/ 这个页面，所以我们可以监听路由信息，只要路径是 /users/ 那么我们就会发起 action，获取用户数据：
以上代码在浏览器访问 /users 路径的时候就会发起一个 action，数据准备完毕，别忘了回到 index.js 中，添加我们的 models：
(添加Effects&)
添加Effects&
我们是不是可以理解成 Reducers 处理同步，Effects 处理异步？这么理解也没有问题，但是要认清 Reducers 的本质是修改 model 的 state，而 Effects 主要是 控制数据流程 ，所以最终往往我们在 Effects 中会调用 Reducers。
把请求到的值放到playload中，通过action.playload来更新state
其中 call 和 put 是 dva 提供的方便操作 effects 的函数，简单理解 call 是调用执行一个函数而 put 则是相当于 dispatch 执行一个 action，而 select 则可以用来访问其它 model
(定义Services&)
定义Services&
将请求相关（与后台系统的交互）抽离出来，单独放到 /services/ 中，进行统一维护管理
之后无论是更新，删除、添加等操作，跟用户相关的都可以统一放置在 /services/users.js 中。
(mock数据&)
mock数据&
(添加样式&)
添加样式&
(设计布局&)
设计布局&