i'm version 1.0.0-rc1 , match function won't render route correctly.
this server
import express 'express'; import react 'react'; import createlocation 'history/lib/createlocation' import router, { match, routingcontext } 'react-router'; import createroutes './create-routes'; const app = express(); const routes = createroutes(); app.use((req, res) => { let location = createlocation(req.url); match({ routes, location }, (error, redirectlocation, renderprops) => { if (redirectlocation) res.status(301).redirect(redirectlocation.pathname + redirectlocation.search) else if (error) res.status(500).send(error.message) else if (renderprops == null) res.status(404).send('not found') else res.send(react.rendertostring(<routingcontext {...renderprops}/>)) }); }); export default app;
this routes
import react 'react'; import { route } 'react-router'; import application './components/application.react'; import home './components/home.react'; export default function() { return ( <route path="/" component={application}> <route path="home" component={home} /> </route> ); }
what do wrong in this? when ask /home, should render <h1>home</h1>
instead of <h1>application</h1>
. simple that.
i based on https://github.com/rackt/react-router/blob/master/docs/guides/advanced/serverrendering.md
thank you
you using subroutes. means, when go "/home" first application rendered, child home injected , available via this.props.children
inside of application component. see here simple example:
try (not nested):
<route path="/" component={application}> <route path="/home" component={home} />
if want render application component around home component use
render() { return ( <div> <h1>application</h1> { this.props.children } </div> ); }
Comments
Post a Comment