无法在状态树中找到路由器减速器，必须将其安装在“路由器”下。

Question

​

​

我正在使用这些版本

"react": "^17.0.2",
"react-dom": "^17.0.2"
"react-router-dom": "^5.2.0"
"connected-react-router": "^6.8.0"
"history": "4.10.1"

导出const browserHistory = createBrowserHistory({ basename：‘/廓清-授权’})

我在状态树中找不到路由器还原器，必须安装在“路由器”下。

reducers.js

export default (history) => {
const appReducer = (asyncReducer) => {
  return combineReducers({
    notifications,
    router: connectRouter(history),
    ...asyncReducer
  })
}
const rootReducer = (state, action) => appReducer(state, action)
return rootReducer
}

store.js

import { createBrowserHistory } from 'history'
export const history = createBrowserHistory({
  basename: '/clearance'
})
const middleware = [routerMiddleware(history), sagaMiddleware, notifications]

const configureStore = (initialState) => {
  const store = createStore(
    createReducer(history),
    initialState,
    compose(
      applyMiddleware(...middleware),
      getReduxDevTools(process.env.NODE_ENV === 'development')
    )
  )
  store.asyncReducers = {}
  store.runSaga = sagaMiddleware.run
  store.close = () => store.dispatch(END)
  return store
    }

export default configureStore

App.js

import configureStore, { history } from './redux/store'
import { ConnectedRouter } from 'connected-react-router'

  <Provider store={store}>
      <ConnectedRouter history={history}>
        <Frame handleScrolling={false}>
         </Frame>
      </ConnectedRouter>
    </Provider>

Answer 1

问题

从您的描述和错误来看，您似乎还没有将连接的路由器添加到根还原器中。

解决方案

导入connectRouter函数并使用router键创建根还原器，并传递history对象。Redux没有匹配的减缩器，特别是connected-react-router选择器试图从不存在的状态中进行选择。

文档中的示例

在你的根还原文件中，

• 创建一个以history为参数并返回根还原器的函数。
• 将router减速器通过history传递给connectRouter，将其添加到根减速器中。
• 注意:关键必须是router**.** // reducers.js从‘redux’导入{ combineReducers }；从‘connected-react路由器’导入{ connectRouter }；. // res的减速器const createRootReducer =(历史记录) => combineReducers({路由器:connectRouter(历史)，…//其他减速器})；导出默认createRootReducer；

..。

导入历史对象和自定义createRootReducer，以便在创建Redux存储时使用。按照connected-react-router文档的其余部分了解细节。

示例：

import { browserHistory } from '../path/to/history';
import createRootReducer from './reducers';

...

createRootReducer(browserHistory);

Answer 2

更改还原器reducers.js中的代码

export default (history) => {
  return combineReducers({
    notifications,
    referenceData,
    clearance,
    lotNotes,
    siteTour,
    buyerNotes,
    router: connectRouter(history)
  })
}