gpt4 book ai didi

javascript - React Router Redux - 使用链接或后退按钮时重复渲染

转载 作者:塔克拉玛干 更新时间:2023-11-02 21:26:12 26 4
gpt4 key购买 nike

当我单击链接或使用后退按钮时,我看到了重复的渲染。我可以转到任何页面并进行真正的浏览器刷新,一切都会正常进行。我的记录器显示 @@router/LOCATION_CHANGE 两次,这导致了很多关于事物重复实例的警告和异常。这似乎不是 hashHistory 与 browserHistory 的问题。正如人们在 github 问题上指出的那样。我在“react-router-redux”:“4.0.7”。将 adjustUrlOnReplay 设置为 false 似乎没有任何作用。一如既往,非常感谢任何帮助!下面是我的 configureStore 和 Routes js 文件。谁能帮我找到问题所在?谢谢!菲利普

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;

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

最佳答案

https://github.com/ReactTraining/history/issues/427更新到 react-router v4 解决这个问题。

关于javascript - React Router Redux - 使用链接或后退按钮时重复渲染,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42212140/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com