When transitioning from one route to another via `<Link />`, mapStateToProps argument is called on previous route's Component

[Mafioso]

I have the following route structure:

<Route path="/" component={App}>
      <Route path="projects" component={TabProjects}>
            <Route path="new" component={ProjectCreate}>
                 <Route path="main" component={ProjectCreateMainData} />
                  <IndexRedirect to="main" />
           </Route>
      </Route>
      ....
      <Route path="report/:id" component={ReportPage} />
      ....
</Route>

My Link located at /report/1 has the following definition:

<Link to='/projects/new'>
       <IconSvg iconKey="button_plus" />
        <div>Новый проект</div>
</Link>

My store is configured:

var store = compose(
  applyMiddleware(thunk, logger), //, m1, m2 - add other middlewares
  reduxReactRouter({
    routes,
    createHistory,
    routerStateSelector: function(state) { return state.get('router'); }
  })

  // devTools()
)(createStore)(rootReducer, storeInitState);

When I am clicking on this Link, I receive the error stack with first sentence as TypeError: Cannot read property 'project' of undefined. According to this stack and the log I received from the middleware, while transitioning from one Route to another, connect([mapStateToProps], ...) is called on a previous component (from which I am transitioning) with new route's location information. I found similar scenarious such as https://github.com/acdlite/redux-router/issues/177#issuecomment-166149565, https://github.com/acdlite/redux-router/issues/214.

[devishot]

+1

[abyken]

have same problem with routing

[Rustem]

+1

[mjrussell]

@Mafioso Are you able to include a sample application/example that behaves this way?

And could you provide your dependencies for redux-router react-router and history?

I've seen the TypeError you mentioned before with misconfigurations or version incompatibilities

[Mafioso]

@mjrussell this is my dependencies:

"dependencies": {
    "classnames": "^2.2.0",
    "deep-compact": "^0.2.4",
    "fbjs": "^0.4.0",
    "history": "^1.16.0",
    "immutable": "^3.7.5",
    "lodash": "^3.10.1",
    "moment-timezone": "^0.4.1",
    "numeral": "^1.5.3",
    "react": "^0.14.2",
    "react-dom": "^0.14.2",
    "react-infinite": "^0.7.2",
    "react-redux": "^4.0.0",
    "react-router": "^1.0.2",
    "redux": "^3.0.4",
    "redux-immutablejs": "0.0.7",
    "redux-logger": "^2.0.4",
    "redux-router": "^1.0.0-beta5",
    "redux-thunk": "^1.0.0",
    "tcomb-form": "^0.7.6",
    "whatwg-fetch": "^0.10.1",
    "zeroclipboard": "^2.2.0"
  }

I will try to prepare example during a day.

[mjrussell]

@Mafioso How are you able to use react-router@1.02 with history@^1.16.0. They included a hard peer dependency on history@1.13.1.

See: https://github.com/rackt/react-router/releases/tag/v1.0.2

Im guessing if you npm install or npm upgrade right now it will fail. I'd suggest trying the following:

    "history": "~1.13.0",
    "react-router": "~1.0.2",
    "redux-router": "1.0.0-beta5",

[Mafioso]

Thank you @mjrussell . But the main problem stayed the same.

[mjrussell]

Was worth a shot...if you are able to get a sample app or failing test definitely let me know. Should make it much easier to track down.