Simple externs for react-router 3.0.0+ (not 4!) for use with Haxe react 1.0.0+.
var history = ReactRouter.browserHistory;
var app = ReactDOM.render(jsx('
<Router history=$history>
<Route path="/" component=$PageWrapper>
<IndexRoute component=$HomeView/>
<Route path="about" component=$AboutView/>
</Route>
</Router>
'), rootElement);
Using haxe-modular it is possible to define asynchronous routes:
var history = ReactRouter.browserHistory;
var app = ReactDOM.render(jsx('
<Router history=$history>
<Route path="/" component=$PageWrapper>
<IndexRoute getComponent=${RouteBundle.load(HomeView)}/>
<Route path="about" getComponent=${RouteBundle.load(AboutView)}/>
</Route>
</Router>
'), rootElement);
You must apply your HOC after the class is loaded.
To keep using RouteBundle.load
you can wrap the view with a container:
<Route path="login" getComponent=${RouteBundle.load(LoginContainer)} />
class LoginContainer extends ReactComponent {
static var LoginViewWithRouter = withRouter(LoginView); // HOC
override function render() {
return jsx('<LoginViewWithRouter {...props} />
}
}
Otherwise you have to use the Bundle.load
promise and follow the getComponent
callback API and use the HOC when the class is loaded.
<Route path="/" component=${Home} onEnter=${enterHandler} />
function enterHandler(nextState:RouterState, replace:String->Void, completed:Void->Void)