这是我的商店.ts
import { createStore, compose, applyMiddleware } from 'redux';
import createSagaMiddleware from 'redux-saga';
import rootSaga from 'sagas';
import rootReducer from 'reducers';
import { history } from 'common/helpers/historyHelper';
import { routerMiddleware } from 'connected-react-router';
declare global {
interface Window { // eslint-disable-line
__REDUX_DEVTOOLS_EXTENSION_COMPOSE__?: typeof compose; // eslint-disable-line
}
}
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const sagaMiddleware = createSagaMiddleware();
export const store = createStore(
rootReducer(),
composeEnhancers(applyMiddleware(sagaMiddleware, routerMiddleware(history)))
);
sagaMiddleware.run(rootSaga);
rootReducer.ts
import { history } from 'common/helpers/historyHelper';
import { combineReducers } from 'redux';
import user from 'scenes/Auth/reducers/user';
import { connectRouter } from 'connected-react-router';
const rootReducer = () => combineReducers({
router: connectRouter(history),
user
});
export default rootReducer;
根Saga.ts
import authSaga from 'scenes/Auth/sagas';
import { all } from 'redux-saga/effects';
export default function* rootSaga() {
yield all([
authSaga()
]);
}
historyHelper.ts
import { createBrowserHistory } from 'history';
export const history = createBrowserHistory();
应用程序.tsx
import React from 'react';
import { Provider } from 'react-redux';
import { store } from '../../store';
import { Page } from 'containers/Page';
import { history } from 'common/helpers/historyHelper';
import { ConnectedRouter } from 'connected-react-router';
const App = () => (
<Provider store={store}>
<ConnectedRouter history={history}>
<Page />
</ConnectedRouter>
</Provider>
);
export default App;
当我单击某个链接来更改路线时,我看到,该路径在我的浏览器中发生了变化,也在 redux-devtools 中,但是组件没有切换,我得到一个错误,你可以在下面看到。我还在 Redux-devtools 中看到了路由器减速器。我不知道如何解决它。