Я постоянно получаю Could not find router reducer in state tree, it must be mounted under "router"
ошибку, когда делаю dispatch(push("/"));
вызов.
index.tsx
const store = configureStore();
ReactDOM.render(
<Provider store={store}>
<ConnectedRouter history={history}>
<Switch>
<Route exact path="/" component={HomeScreenContainer} />
<Route exact path="/login" component={LoginScreenContainer} />
</Switch>
</ConnectedRouter>
</Provider>,
document.getElementById('root'),
);
configureStore.ts
export const history = createBrowserHistory();
export default function configureStore(preloadedState?: any) {
const store = createStore(
createRootReducer(history),
preloadedState,
composeWithDevTools(applyMiddleware(thunk, routerMiddleware(history))),
);
return store;
}
reducers.ts
const createRootReducer = (history: History<any>) =>
combineReducers({
router: connectRouter(history),
login: LoginReducer,
});
export default createRootReducer;
После нажатия кнопки отправки в моей форме входа я отправляю loginAsync
создателю действия:
export const loginAsync = (login: LoginCredentials) => {
return (dispatch: any) => {
if (login.username != '[email protected]' || login.password != '1234') {
dispatch({
type: SET_LOGIN_ERROR_MESSAGE,
message: 'Invalid username/password',
});
} else {
console.log('SUCCESS LOGIN');
dispatch(replace('/')); // ERROR HERE
}
};
};
Моя консоль показывает, что сообщение SUCCESS LOGIN
напечатано, но сообщение об ошибке, приведенное выше, отображается сразу после него.
Если я смотрю на URL-адрес, кажется, что URL-адрес указывает на правильный путь /, но на экране по-прежнему отображается форма входа, а не моя домашняя страница.
Любая помощь будет принята с благодарностью.