相同反应组分的多个实例

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安装它,如上所述.