建议使用 isomorphic router，就是 browser 与 node 都可以用的 router ## 8.1 [direactor](https://github.com/flatiron/director) 非常轻量级的通用 router，并不是专门为 react 准备的，但是 router 而已，为毛要跟 component 耦合。 ### client side ~~~ var routes = { '/author': ()=>React.render(<Author/>, domNode), '/author/:id': (id)=>React.render(<Auther id={id}/>, domNode) }; var router = Router(routes); router.init(); ~~~ ### server side 只需要调用 router.dispatch 就好了, 而且 server 端的 react 需要 `renderToString` ~~~ var router = new director.http.Router({ '/author': { get: function(){ this.res.end(React.renderToString(<Author/>)) } } }); var server = http.createServer(function (req, res) { router.dispatch(req, res, function (err) { res.writeHead(200, { 'Content-Type': 'text/html' }) if (err) { res.writeHead(404); res.end(); } }); }); ~~~ ## 8.2 [react router](https://github.com/rackt/react-router) 非常 **非轻量级** 的 router，而且只能给 react component用。 概念上就是使用 Route 把你的 Component 包起来，让 router 决定到底哪个 componet 上 ~~~ render(( <Router> <Route path="/" component={App}> <Route path="about" component={About}/> <Route path="users" component={Users}> <Route path="/user/:userId" component={User}/> </Route> <Route path="*" component={NoMatch}/> </Route> </Router> ), document.body) ~~~