文章/答案/技术大牛

发布

社区首页 >问答首页 >呈现组件服务器端的最佳方法？(没有客户端服务器链接，仅在服务器上)

问呈现组件服务器端的最佳方法？(没有客户端服务器链接，仅在服务器上)
EN

Stack Overflow用户

提问于 2016-02-24 10:54:51

回答 1查看 368关注 0票数 0

我想知道如何最好地呈现服务器端(而不是在客户机上呈现)和处理来自异步查询的状态更改。

理想的例子：

服务器获得生成HTML的请求
服务器“需要”一个react组件，传递一些道具
react组件在服务器中呈现，但它必须执行Ajax/Socket查询才能获得一些信息。事件将被发送，响应将在稍后出现。
react组件改变状态，更改输出。
生成的HMTL已经就绪，并具有最新的状态更改。

这里发生的事情是，ReactDOM.renderToStaticMarkup()，如预期的那样，不会等待组件完成状态更改(在本例中，等待数据并重新呈现)。

澄清：

这里没有客户，这不是典型的SSR。我只需要服务器上的完整HTML，以便以后可以执行其他操作。这里的问题是如何等待那些异步调用，使用我在客户机上使用的组件(它有状态和一些setStates)。

那么，我认为唯一的方法是拥有只接收道具的无状态组件(以前执行所有的套接字处理，然后将数据传递给每个组件)。现在，组件反应平平，不涉及Redux (这就是为什么它们不是无状态的)。

还有其他的想法/方法吗？

谢谢!

reactjs

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-02-24 11:18:10

如果不涉及客户端，那么无论发生什么，您都需要等待所有数据加载才能呈现。

如果可能，我建议将所有异步工作移到组件树之外。然后将其传递到根组件，在调用render时分发给子组件(通过道具)。

createAsyncState(function(state) {
  // generate the markup for this component tree
  const markup = ReactDOMServer.renderToString(
    <Component state={state} />
  );

  // serve the markup to the client
  res.end(markup);
});

如果您也想在客户端上使用相同的组件，那么您所需要做的就是确保您的createAsyncState等效物也在浏览器中工作。

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/35600120

复制

相似问题

问呈现组件服务器端的最佳方法？(没有客户端服务器链接，仅在服务器上)
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问呈现组件服务器端的最佳方法？(没有客户端服务器链接，仅在服务器上)EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问呈现组件服务器端的最佳方法？(没有客户端服务器链接，仅在服务器上)
EN