Dva里面最重要的是Model
我们先说Model
1) dva 通过 model 的概念把一个领域的模型管理起来,包含同步更新 state 的 reducers,处理异步逻辑的 effects
新建一个model.js
import { getknowledgeList } from '@/services/wrongQuestions' //引入我们的service
export default {
namespace: 'products',
state: {
getTopicType: [],
num:1
},
reducers: {
fetchAfter(state, action) {
return Object.assign({}, state, action.payload)
},
},
Effect: {
//call:执行异步函数
//put:发出一个 Action,更新store,类似于 dispatch
//select :可以获取当前model中的state
*addAfter1Second(action, { call, put, select }) {
const { num } = yield select( (state) => {
return state.products;
} );
const queryCourseList = yield call(getknowledgeList, payload);
yield put({ //储存数据
type: 'fetchAfter',
payload: {
getTopicType: queryCourseList.data
}
});
}
};
这个 model 里:namespace
表示在全局 state 上的 key(model的名字)
state
是初始值,在这里是空数组 (存放数据的地方)reducers
等同于 redux 里的 reducer,接收 action,同步更新 state (处理同步操作,修改 state)- effect 接收 action,用来处理异步操作的,effect是一个 Generator 函数内部使用 yield 关键字,标识每一步的操作(不管是异步或同步)(我们自己的ajax接口 就是写在这里)
2) 多任务调度
- 并行,若干个任务之间不存在依赖关系,并且后续操作对它们的结果无依赖
- 竞争,若干个任务之间,只要有一个执行完成,就进入下一个环节
- 子任务,若干个任务,并行执行,但必须全部做完之后,下一个环节才继续执行
我这里通过以下代码来实现
yield put({ type: 'fetch/start' });
yield put({
type: 'fetchAfter',
payload:{
topicSource:action.payload.topicSource
},
});
yield ( yield put({type:'getTopicList'}) );
yield put({ type: 'fetch/end' });