如果我有以下HTML：
<div id="myreactcomponent">
<h1>Headline</h1>
<p>Content</p>
</div>
然后将ReactJS组件初始化为#myreactcomponent div，我可以以某种方式在组件内部渲染h1和p元素吗？像这样：
return (
<Header></Header>
{ place h1 and p here }
<Footer></Footer>
);
在ReactJS中有一个选项吗？
您可以检查此JSFiddle来查看我的问题的演示。
对于熟悉Angular的人：我<ng-transclude/>在React中搜索transclude选项和AngularJS指令的标签。
对于熟悉Polymer的人们：我<content/>在React中搜索与之等效的标签。
更新
我尝试了该this.props.children属性，但是据我所知，这仅在初始HTML已经在React组件中时才起作用。我确实需要渲染最初将第一个React组件渲染到的元素的子代。
更新2
在我的情况下，将HTML移入组件的初始化中（如JSFiddle的更新所示）是不可行的，因为呈现初始HTML和React组件的系统不同。
像这样
..
render(){
return (
<Header></Header>
<span dangerouslySetInnerHTML={{__html:'content'}}></span>
<Footer></Footer>
)
}
..
var content = '<h1>This is a header</h1><p>This is some para..</p>'
这是您所指的吗？您可以在这里阅读更多有关此的内容。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句