Redirection with React Router Component

Question

I'm having a problem with react-router-component. I'm trying to make a redirect library that does a "soft" redirect (equivalent to clicking a link, as opposed to window.location = ...) that I can require from a .jsx component.

Per the docs I should just be able to call router.navigate(path) to redirect.

When, for example, I call this on page A, the url in the address bar changes to page B as desired. However, page A simply reloads, leaving the address bar as page B and the display as page A. Suggestions?

Answer 1

You should be able to solve this using the Navigation mixin.

Then you can use this.transitionTo with the name of your page.

var PageAdd = React.createClass({

    mixins : [Router.Navigation],

    handleSubmit : function(e) {
        e.preventDefault();

        this.transitionTo('pages');

    },

    render: function () {
        return (
            <form onSubmit={this.handleSubmit}>
                <button type="submit" className="btn btn-default">Submit</button>
            </form>
        );
    }
});

Read more: https://github.com/rackt/react-router/blob/master/docs/api/mixins/Navigation.md