從onEnter調度動作時超出最大調用堆棧大小

Question

我試圖在進入頁面時調度動作，但由於某種原因它導致被調度動作的無限循環。

這裏是我的代碼：

const routes = (store) => { 
    const test = (nextState, replace, callback) => { 
    Promise.resolve(store.dispatch({type: 'test'})).then(callback()); 
    }; 

    return (
    <Route path="/" component={App}> 
     <IndexRoute component={LoginPage}/> 
     <Route path="/home" component={HomePage} onEnter={test}/> 
    </Route> 
    ); 
}; 

我試着更換一個簡單的console.log調度，這不會發生。 這只是當我試圖派遣從輸入

Answer 1

原來是因爲我使用immutablejs和沒有正確配置react-router-redux。

我：

const history = syncHistoryWithStore(browserHistory, store, { selectLocationState(state) { 
    return state 
     .get('routing') 
     .toJS(); 
    }}); 

我現在用的，而不是：

const createSelectLocationState =() => { 
    let prevRoutingState, 
    prevRoutingStateJS; 
    return (state) => { 
    const routingState = state.get('routing'); // or state.routing 
    if (typeof prevRoutingState === 'undefined' || prevRoutingState !== routingState) { 
     prevRoutingState = routingState; 
     prevRoutingStateJS = routingState.toJS(); 
    } 
    return prevRoutingStateJS; 
    }; 
}; 

const history = syncHistoryWithStore(browserHistory, store, {selectLocationState: createSelectLocationState()}); 

，它的正常工作。

來源：https://github.com/sjparsons/react-router-redux-immutable