Dva: 如何在dva中添加redux-thunk中间件

[wuzhuzhu]

我理解dva内置了saga。然而有些场景还是用thunk方便
yarn add redux-thunk, import thunk 之后
extraEnhancers: [thunk, autoRehydrate()]
得到报错

Uncaught TypeError: a.subscribe is not a function

[liumin1128]

saga能胜任thunk的全部工作，在使用时可以灵活一点，可以尝试将callback成参数传递到effects，或许会用得上

[wuzhuzhu]

saga我在很多场景已经使用了。在这里不必具体讨论哪些场景更适用于thunk。有些场景使用thunk做流程控制显得更直观和逻辑集中，而且thunk可以更方便的传入一些外部参数和变量。开这个issue只想讨论下dva中有没有可能加入thunk并行使用，因为在creat react app的项目中这样是可以的

[sorrycc]

可以通过 onAction hook 加入中间件，https://github.com/dvajs/dva/blob/master/docs/API_zh-CN.md#onactionfn--fn

[wuzhuzhu]

厄
redux-thunk的installation steps如下:

import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import rootReducer from './reducers/index';

// Note: this API requires redux@>=3.1.0
const store = createStore(
  rootReducer,
  applyMiddleware(thunk)
);

试了下简单的把中间件注册到onAction里面

import thunk from 'redux-thunk';
export const app = dva({
  history: browserHistory,
  extraEnhancers: [autoRehydrate()],
  onAction: thunk,
});

倒是没有报错 但是按照redux-thunk的写法写action

export function changeGroupType(key) {
  return function (dispatch, getState) {
    return {
      type: 'gamePortal/changeGroupType',
      key,
    }
  }
}

不起作用...
@sorrycc

[ystarlongzi]

@wuzhuzhu 最后怎么解决的？我看源码是把自定义的额 middleware 给放到后面去啦 😹😹

https://github.com/dvajs/dva/blob/a5e4ca58b8d40685545cc5bff6a92736afc94d24/packages/dva-core/src/createStore.js#L22-L27

[ystarlongzi]

这里把 setupMiddlewares 写死了，导致外面无法控制 middleware 的顺序，从而无法引入 redux-thunk。。。。。。。。。。。。

https://github.com/dvajs/dva/blob/a5e4ca58b8d40685545cc5bff6a92736afc94d24/packages/dva/src/index.js#L23-L37

[aizigao]

@ystarlongzi 我有个老项目，有上的thunk,　你还需要添加一个reducer处理,　下面的配置是在umi下的，也差不多

import reduxThunk from 'redux-thunk';
import oldReducer from './patch_old_version/reducer';

export const dva = {
  config: {
    onAction: reduxThunk,
    extraReducers: oldReducer,
  },
};

[ystarlongzi]

@aizigao 嗯嗯，多谢，确实是这样的。

大致看了下 dva 和 umi 的源码，主要这个 export const dva = {} 约定也太隐晦了，刚接手项目，一脸懵逼