dva:是一个基于redux和redux-saga的数据流方案
dva的九个概念
(1)state(状态或者数据)
数据的初始值,在dva初始化的时候和在model里面的state对其两处进行定义,其中modal中的优先级低于传给dva()的 opts.initalState。
(2)Action(行为)可以是同步也可以是异步
action的格式如下,它需要有一个type,表示这个action要触发什么事件,payload代表action传递的数据
(3)Model(模型)对数据进行整合和管理,逻辑都在这边进行处理分发
1 namespacce:命名空间,唯一值,只能使用字符串,在发送action到相应的reducer时,就会需要用到namesapce
2 state:存放数据(和之前的state概念一样,只是层级比较低)
3 reducer(纯函数):以key/value格式进行定义,处理同步操作,唯一可以修改state的地方,有action触发
4 effect(异步):异步处理逻辑,不直接修改state,只是从服务器获取数据,然后发起actiong交给reducer
*add(action, { call, put }) {
yield call(delay, 1000);
yield put({ type: 'minus' });
},
put:用来触发action
call:用来调用异步逻辑。支持promise
select:用于从state获取数据
5 subscription 订阅:用来订阅一个数据源:在数据源(时间,路由,服务器连接)改变时进行使用
(4) Router:路由配置信息
export default function({ history }){
return(
<Router history={history}>
<Route path="/" component={App} />
</Router>
);
}
RouteComponent:表示Router里匹配路径的组件,通常会绑定在model的数据
import { connect } from 'dva';
function App() {
return <div>App</div>;
}
function mapStateToProps(state) {
return { todos: state.todos };
}
export default connect(mapStateToProps)(App);