Using React-Router in ES5, I have the below code
var React = require('react');
var Render = require('react-dom').render;
var Router = require('react-router').Router;
var Route = require('react-router').Route;
var hashHistory = Router.hashHistory;
var browserHistory = Router.browserHistory;
var About = require('./components/about/aboutPage');
var routes = (
<Router>
<Route path="/" handler={App}>
<Route path="about" handler={About}/>
</Route>
</Router>
);
module.exports = routes;
This is rendered in {main.j} as
var ReactDOM = require('react-dom');
var Router = require('react-router').Router;
var routes = require('./routes');
ReactDOM.render(<Router>{routes}</Router>, document.getElementById('app'));
However, in the console, am getting this warning and nothing loads up:
bundle.js:1845 Warning: [react-router] `Router` no longer defaults the history prop to hash history. Please use the `hashHistory` singleton instead
I have clearly passed {hashHistory} in the code above, but still it keeps on complaining.
Any hints on what could be going wrong?
Thanks
Found the reason - It was an issue with my rendering code
ReactDOM.render(<Router>{routes}</Router>, document.getElementById('app'));
as {routes} already contained {}, there was no need to specify it again whilst rendering. Because of this, ofcourse, {history} prop was missing in the render code. So, I just changed the render code to:
ReactDOM.render(routes, document.getElementById('app'));
and it works perfectly fine!
Thanks