Nico Galluzzo
Nico Galluzzo

Reputation: 565

Link to changes state but does not change URL

Using renderToString to render my components server-side. All of that is working just fine. If I manually enter a URL like /register, my components are rendering perfectly.

Problem is, when using <Link> in my app, the state is changing but my URL is not updating at all.

route.js:

import React from 'react';
import { render } from 'react-dom';
import { Provider } from 'react-redux';
import { browserHistory, Router, match } from 'react-router';
import routes from './routes';
import store from './stores';

// Server rendering works identically when using async routes.
// However, the client-side rendering needs to be a little different
// to make sure all of the async behavior has been resolved before the
// initial render,to avoid a mismatch between the server rendered and client rendered markup.

match({ location:browserHistory, routes }, (error, redirectLocation, renderProps) => {
  render((
    <Provider store={store}>
      <Router {...renderProps} />
    </Provider>
  ), document.getElementById('root'));
});

I have a feeling it could be due to browserHistory, is there something I'm missing?

Upvotes: 2

Views: 570

Answers (1)

Nico Galluzzo
Nico Galluzzo

Reputation: 565

I was giving match() the wrong arguments. Instead of:

match({ location:browserHistory, routes }

It should have been:

match({ history:browserHistory, routes }

Upvotes: 2

Related Questions