React-router externs for Haxe
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
router
README.md
haxelib.json

README.md

React-router externs for Haxe

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);

Tips

Q. how to use a High-Order Component with a modular route?

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.

Q. what is the syntax to set an event handler?

<Route path="/" component=${Home} onEnter=${enterHandler} />

function enterHandler(nextState:RouterState, replace:String->Void, completed:Void->Void)