请问大佬们,DvaJS怎么控制Model中Effect的执行顺序?

元素的光芒
  • 1
新手上路,请多包涵

最近在做一个基于AntD Admin的项目,在开发中遇到一个问题,不知道怎么控制Effect的执行顺序。

当第一次进入或刷新 /index 这个页面的时候,页面Model的 effect query 执行的时候,全局Model里面的 effect initUserInfo 还没执行完成,导致权限控制失效,不能判断当前用户是否可以访问 /index 页面。

以下为伪代码

models/app.js

import api from 'api';
const { initConfig, checkUser, loadPermissions } = api;
export default {
  namespace: 'app',
  subscriptions: {
    setup({ dispatch }) {
      dispatch({ type: 'initConfig' })
      dispatch({ type: 'initUserInfo' })
    }
  },
  effects: {
    /* 加载项目配置 */
    *initConfig({ payload }, { call, put }) {
      let res = yield call(initConfig);
      if (res.success) yield put({ type: 'xxx', { data: res.data } });
    },
    /* 获取用户信息及权限信息 */
    *initUserInfo({ payload }, { call, put }) {
      let { userId, token } = store.get('userInfo');
      if (userId && token) {
        let userRes = yield call(checkUser, { userId, token });
        if (userRes.success) {
          store.set('userInfo', userRes.data);
          /* 加载用户权限信息 */
          let res = yield call(loadPermissions, { userId });
          if (res.success) store.set('permissions', res.data);
        }
      }
    }
  },
  reducers: {
    ...
  }
}

pages/index/model.js

import api from 'api';
const { pathToRegexp } = require('path-to-regexp');
const { getIndexPage } = api;
export default {
  namespace: 'index',
  subscriptions: {
    setup({ dispatch, history }) {
      history.listen((location) => {
        if (pathToRegexp('/index').exec(location.pathname)) {
          dispatch({ type: 'query', payload: { ...location.query } });
        }
      })
    }
  },
  effects: {
    /* 加载页面数据 */
    *query({ payload }, { call, put }) {
      let res = yield call(getIndexPage);
      if (res.success) yield put({ type: 'xxx', { data: res.data } })
    }
  },
  reducers: {
    ...
  }
}
回复
阅读 73
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
你知道吗?

宣传栏