Question

多个 Redux 中间件导致超出最大调用堆栈大小

2018-03-17

1182

javascript reactjs redux

我得到了

Uncaught RangeError: Maximum call stack size exceeded
    at eval (index.js?4bd6:38)
    at Object.dispatch (applyMiddleware.js?6ce6:35)
    at dispatchChildActions (index.js?4bd6:33)
    at eval (index.js?4bd6:39)
    at Object.dispatch (applyMiddleware.js?6ce6:35)
    at dispatchChildActions (index.js?4bd6:33)
    at eval (index.js?4bd6:39)
    at Object.dispatch (applyMiddleware.js?6ce6:35)
    at dispatchChildActions (index.js?4bd6:33)

当我尝试将 redux-batched-actions 中间件添加到我的 applyMiddleware()

const store = createStore(
  enableBatching(appReducer), // added enableBatching
  composeWithDevTools(
    applyMiddleware(
      batchDispatchMiddleware, // and this
      sagaMiddleware,
      historyMiddleware,
    )
  )
)

出了什么问题？

Answer 1

我花时间为您检查了源代码。这是一个软件包错误。我已提交 pull 请求。

之前的合并导致无限递归，其中非批处理操作被重复分派。我还认为您应该仅根据您的用例使用中间件或高阶减速器，请参阅 ReadMe 了解简要说明。请尝试修复并告诉我，因为我目前没有设置项目。

希望这能解决您的问题！

Answer 2

不确定。

这是对我有用的代码，也许它会有所帮助：

const composeEnhancers =
  typeof window === 'object' &&
  window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ?
    window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
    }) : compose;

const enhancers = composeEnhancers(
  applyMiddleware(ReduxThunk),
  autoRehydrate()
);

const initialState = {};
const store = createStore(
  reducers,
  initialState,
  compose(enhancers)
);
persistStore(store);

ReactDOM.render(
  <Provider store={store}>
    <div>
      <BrowserRouter>
          <Switch>
            <Route exact path="/" component={Home} />
            <Route path="/xxx" component={XXX} />
          </Switch>
          <Footer />
      </Container>
      </BrowserRouter>
    </div>
  </Provider>
  , document.querySelector('#app'));

Answer 3

当我忘记将操作括在花括号中时，我遇到了同样的错误：

return bindActionCreators(...TaskActions, ...UserActions, dispatch)

而不是

return bindActionCreators({...TaskActions, ...UserActions}, dispatch)