I have header with logo. When user logs, another div appears in the header with users name and logout link (changes the state of the app) and content changes. So I would like to pass the state signedup: 1
to react-router
so that when user is logged in and goes to /documentation
that it shows additional div with his name and logout. And if the user isnt logged in and goes to /documentation
that it doesnt show that div.
I have searched on SO and found this Link
var Dashboard = require('./Dashboard');
var Comments = require('./Comments');
var CommentsWrapper = React.createClass({
render: function () {
return (
<Comments myprop="myvalue" />
);
}
});
var Index = React.createClass({
render: function () {
return (
<div>
<header>Some header</header>
<RouteHandler />
</div>
);
}
});
var routes = (
<Route path="/" handler={Index}>
<Route path="comments" handler={CommentsWrapper}/>
<DefaultRoute handler={Dashboard}/>
</Route>
);
ReactRouter.run(routes, function (Handler) {
React.render(<Handler/>, document.body);
});
This works but isnt for my case. As this will not pass changed state only initial. So how would i do this?
I had got an idea to change the content based on state, But the problem with that is back button doesnt work and user cant write /documentation
to go to that page.