Nextjs with redux redux-saga initialize store



像这样

import {createStore, applyMiddleware, combineReducers} from 'redux'
import {composeWithDevTools} from 'redux-devtools-extension'
import withRedux from 'next-redux-wrapper'
import nextReduxSaga from 'next-redux-saga'
import createSagaMiddleware from 'redux-saga'
import {initialState} from './initialState'
import globalSaga from '../sagas/global'
const sagaMiddleware = createSagaMiddleware()
export function configureStore (reducers,initialState) {
  console.log(initialState)
  let states = {}
  Object.keys(reducers).map((key) => {
    states[key] = initialState[key]
  })
  console.log(reducers)
  console.log(states)
  const store = createStore(
    combineReducers({reducers}),
    states,
    composeWithDevTools(applyMiddleware(sagaMiddleware))
  )
  store.sagaTask = sagaMiddleware.run(globalSaga)
  return store
}
export function withReduxSaga (BaseComponent, reducers) {
  return withRedux(configureStore(reducers,initialState))(nextReduxSaga(BaseComponent))
}
export default function configureWithReduxSaga(component,reducers){
  return withReduxSaga(component,reducers)
}

错误是

Store does not have a valid reducer. Make sure the argument passed to
makeStore is not a function

可能有什么问题,基本上我想编写函数,将具有特定sagas的reducerstore.global添加到nextjs组件中,而无需太多代码,最好是这样的:

configureWithReduxSaga(
{reducer1, reducer2},
{saga1, saga2}
)

可能吗?我可以创建根化简器和根传奇并将其传递给每个组件,这并不难编码,但它的性能吗?

combineReducers({reducers}),

很可能你有化简器字典,但将它们包装成冗余对象。在这种情况下,请使用 rest spread 运算符combineReducers({...reducers})或简单的对象传递combineReducers(reducers)。请参阅原始文档:https://redux.js.org/docs/api/combineReducers.html#arguments

如果reducers数组,则应遍历它并为每个化简器指定自己的名称。

最新更新