Reactjs 如何显示带有{this.props.children}的嵌套HTML内容？

我试图显示嵌套在React模态组件中的标准HTML内容。我认为在组件中使用

{this.props.children}

可以显示嵌套的HTML，但是打开时段落不会出现在模式中。我希望将内容保留在HTML文件中，而不在React组件中

这个问题的一个密码是

HTML:

要在modal中显示的内容

JS:

类模态扩展React.Component{
建造师（道具）{
超级（道具）；
此.state={
伊斯莫达洛彭：错
};
//绑定函数
this.closeModal=this.closeModal.bind（this）；
this.openModal=this.openModal.bind（this）；
}
//闭合模态
closeModal（）{
this.setState（{isModalOpen:false}）；
}
//开放模态
openModal（）{
this.setState（{isModalOpen:true}）；
}
render（）{
返回(
点击我
X
{this.props.children}
接近
);
}
}
ReactDOM.render(
,
document.getElementById（'testModal'）
);

this.props.children

指的是从React代码而不是HTML文件传入的组件

因此，在

reacadom.render中传递模式内容

ReactDOM.render(
要在modal中显示的内容

,
document.getElementById（'testModal'）
);

这是叉子


对评论的答复

是的，你可以，但你仍然需要以某种方式传递内容


我使用
document.getElementById
获取模式内容，并将其作为子级传递给
。

（如果您计划使用
this.props.children
，也就是说，或者您可以使用
document.get/querySelect…
从HTML获取内容）

这是更新的。
请尝试编写
内容以显示在modal
中。我在Hi Sung之前遇到过此问题，是否有方法从HTML文件传递内容？我希望保留React组件文件中的内容。您仍然需要将其传递到
ReactDOM.render
中，但您可以使用
document.getElement/querySelect…
从HTML获取内容。请参阅更新的答案。