2017-02-13 6 views
3

링크를 클릭하거나 뒤로 버튼을 사용할 때 중복 렌더링이 표시됩니다. 어떤 페이지로 가서 실제 브라우저를 새로 고치면 모든 것이 제대로 작동합니다. 내 로거가 @@ router/LOCATION_CHANGE 번을 두 번 보여 주며 중복되는 상황에 대한 경고 및 예외가 많이 발생합니다. 이것은 hashHistory와 browserHistory의 문제는 아닌 것으로 보입니다. 사람들은 github 문제를 지적했습니다. 나는 "react-router-redux"에있다 : "4.0.7". adjustUrlOnReplay를 false로 설정해도 아무 것도 수행되지 않습니다. 언제나처럼 어떤 도움을 주셔서 감사합니다! 아래는 configureStore와 Routes js 파일입니다. 아무도 내가 여기서 문제를 찾도록 도와 줄 수 있습니까? 감사! 필립React Router Redux - 링크 또는 뒤로 버튼을 사용할 때 중복 렌더링

configureStore.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; 

routes.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')); 
} 

답변