Search code examples
reactjsfluxreact-router

How to pass flux to react-router 1.0.0


http://fluxxor.com/examples/react-router.html#/

This shows how to do it for the old version of React-router.

Does anyone know how to pass flux as a prop to your top-level component in react-router 1.0.0?

I saw somewhere in the docs that in react-router 1.0.0 routes can just be described as objects and this means you can pass in arbitary props. However this isn't working for me:

 routes =
      path: "/"
      flux: flux
      component: App
      childRoutes: [
        {path: "/path/to/path", component: Comp, flux: flux}
      ]


    React.render(<Router routes={routes} />, document.getElementById("app"))  

No sign of flux as a prop on App.

The syntax is Coffee Script but basically routes is an object,


Solution

  • As stated here:

    https://github.com/BinaryMuse/fluxxor/issues/137

    You can pass a function to the Router createElement property which passes the flux property down to the children components.

    const createFluxComponent = (Component, props) => {
        return <Component {...props} flux={flux} />;
    };
    
    React.render(
      <Router createElement={createFluxComponent}>
      ...