React Router Redux — дублирование рендеринга при использовании кнопки «Ссылка» или «Назад»

Я вижу повторяющиеся рендеры, когда нажимаю ссылку или использую кнопку «Назад». Я могу зайти на любую страницу и сделать реальное обновление браузера, и все будет работать правильно. Мой регистратор дважды показывает @@router/LOCATION_CHANGE, и это вызывает множество предупреждений и исключений, связанных с дублированием экземпляров вещей. Похоже, это не проблема hashHistory и browserHistory. Как люди указывали на проблемы с github. Я на "реагировании-маршрутизаторе-редукс": "4.0.7". Установка для настройки AdjustUrlOnReplay значения false ничего не дает. Как всегда, очень ценю любую помощь! Ниже приведены мои js-файлы configureStore и Routes. Может ли кто-нибудь помочь мне найти проблему здесь? Спасибо! Филипп

настроитьStore.js

import { createStore, applyMiddleware, combineReducers, compose } from 'redux'
import thunk from 'redux-thunk'
import logger from 'redux-logger'
import rootReducer from '../reducers'
import createSagaMiddleware from 'redux-saga'
import rootSaga from '../sagas/sagas'
import promiseMiddleware from 'redux-promise-middleware'
import { syncHistoryWithStore} from 'react-router-redux'
import { browserHistory } from 'react-router'
import { apiMiddleware } from 'redux-api-middleware';

const sagaMiddleware = createSagaMiddleware()

const initialState = {
};

const enhancers = compose(
  window.devToolsExtension ? window.devToolsExtension() : f => f
);

const store = createStore(rootReducer, initialState, compose(
    applyMiddleware(apiMiddleware, thunk, logger(), sagaMiddleware),
    typeof window === 'object' && typeof window.devToolsExtension !== 'undefined' ? window.devToolsExtension() : f => f
  ));

export const history = syncHistoryWithStore(browserHistory, store);
sagaMiddleware.run(rootSaga);
export default store;

маршруты.js

import App from './App'
import '...a bunch of different components'
import { Provider } from 'react-redux'
import { Router, Route, IndexRoute, browserHistory } from 'react-router'
import store, { history } from './store/configureStore.js'

const router = (
  <Provider store={store}>
    <Router history={history}>
      <Route path="/" component={App}>
        <IndexRoute component={TeamsContainer}/>
        <Route path="teams" component={TeamsContainer} />
        <Route path="teams/:teamId" component={TeamContainer} />
        <Route path="teams/:teamId/add_member" component={AddMemberContainer} />
        <Route path="teams/:teamId/team_members/:teamMemberId" component={TeamMemberContainer} />
      </Route>
    </Router>
  </Provider>
)

if ( $('#app').length ) {
  ReactDOM.render(router, document.getElementById('app'));
}

person withintheruins14    schedule 13.02.2017    source источник


Ответы (1)


https://github.com/ReactTraining/history/issues/427 Обновление для реагирования -маршрутизатор v4 решить эту проблему.

person Kendrick johnson    schedule 22.08.2017