单独渲染每个React.js子组件
问题描述:
我使用React.js渲染出大部分HTML,并且此工作正常。然而,在使用cms框架的部分,这期望每个组件都在cms创建的一些自动生成的html内,而我无法在反应代码中生成这些html。下面的实施例:单独渲染每个React.js子组件
发生反应生成的代码
<div class=“react-component-1”>
<img src=“foo.png”/>
</div>
<div class=“react-component-2”>
<p>Some text</p>
</div>
CMS
<div class=“some-generated-value”>
<div class=“react-component-1”>
<img src=“foo.png”/>
</div>
</div>
<div class=“some-generated-value”>
<div class=“react-component-2”>
<p>Some text</p>
</div>
</div>
我React.js码具有基本上为整个页面,然后有许多子组件的单个部件/容器。我想要做的是按照正常方式创建React.js组件,然后以某种方式将每个孩子插入到相关的div中,我可以通过Ids来创建它们。是否有可能以某种方式访问这些子组件中的每一个,并将它们分别渲染到相应的自动生成的div中?我试过看*组件上的React.createElement创建的对象,但我无法弄清楚如何识别子组件/访问那里的属性。
答
你可以看看ReactDOM.render()。这允许你在你喜欢的任何容器中分别注入你的组件。 这取决于您使用的是哪个React版本。我相信这是14岁以上。本页解释*API https://facebook.github.io/react/blog/2015/10/01/react-render-and-top-level-api.html
我认为这应该做的伎俩,谢谢 – Sutty1000