相同反应组分的多个实例

Question

我想在非反应网站上添加一个反应组件，一个评论功能。

该网站有一个无限滚动的新闻页面。在每个新闻报道下，我想要包含react评论组件。我计划在FB教程之后对其进行建模：http://facebook.github.io/react/docs/tutorial.html

我的问题是，如何将每个React组件动态挂载到DOM故事元素？基本上，我希望有相同的反应注释组件的许多实例，但每个实例都绑定到一个独特的故事（div）。

我想我需要在服务器端渲染react组件，在那里我可以动态设置React.renderComponent。任何指针/例子都赞赏。

Answer 1

添加帖子后，您需要拥有数据和目标dom节点（我们将这些变量称为data和el）

React.render(<MyComponent data={data} />, el);

或没有JSX

React.render(React.createElement(MyComponent, {data: data}), el);

要清理：

React.unmountComponentAtNode(el);

对于服务器端渲染，您可以执行以下操作：

React.renderToString(React.createElement(MyComponent, {data: data}))

并且只要结果在客户端上以el结尾，就可以使用上面提到的React.render挂载它。