4

我有一个简单的应用程序,它显示用户的评论列表。当单击用户时,应用程序应该转到/users/<id>并显示一个新页面,其中包含将从 MongoDB 查询的用户详细信息。我很难理解该逻辑应该在哪里。

我看到了在客户端中使用 react 路由器的示例,例如:

render((
<Router>
  <Route path="/" component={App}>
     <Route path="/user/:userId" component={User}/>
  </Route>
</Router>
), document.body)

但在服务器端也是这样:

<Route name="root" path="/" handler={require('./handlers/Root')}>

并且还使用快速路由:

app.get('/', function home (req, res, next) {
  res.render('layout', {
    reactHtml: React.renderToString(<App />)
  });
});

app.get('/user', function home (req, res, next) {
  res.render('layout', {
    reactHtml: React.renderToString(<User />)
  });
});

哪一个是要走的路?有什么区别?

4

2 回答 2

2

如您所见,React 应用程序通常最初只是客户端,附加到节点。这就是它如此快速的原因:只有 API 调用,没有重新渲染。

同构应用程序也在服务器上运行,这有助于回退(无 JS)以及 SEO 和社交共享(Facebook 需要读取 HTML 元标记。这一点都不容易实现。你也可以变得非常花哨和从服务器渲染中获取水合物,从而加速那些更深层次的页面上的用户体验。

您可能永远不会想要的只是渲染服务器端。有点错过 React 的全部功能。

启动客户端,使用一些好的样板,例如https://github.com/erikras/react-redux-universal-hot-example,它将带您一路同构并再次返回。

于 2015-11-05T03:23:28.667 回答
0

使用 react 可以制作单页应用程序,因此您永远不会重新加载页面,使用 express 可以使用 php 制作像 apache 这样的服务器

于 2015-11-04T13:22:30.520 回答