将react组件添加到html元素
将react组件添加到html元素
提问于 2020-03-13 06:06:32
我有一个containerElement和一个react组件。我想将react组件添加到containerElement中。有没有办法让我这么做？我尝试过containerElement .appendChild()，但不起作用。
const containerElement = document.getElementById(divId);
React component: <ReactComponent></ReactComponnet>回答 2
Stack Overflow用户
发布于 2020-03-13 06:23:37
ReactDOM.render(<ReactComponent/>, document.getElementById(divId));Stack Overflow用户
发布于 2020-03-13 07:40:15
遵循React生命周期，您不应该将组件插入到父组件(containerElement)中。react组件应该作为父组件的子组件或孙组件插入到正常流中。
如果我对您的问题理解正确，您需要处理在React生命周期的正常流程之外获取DOMElement的情况。为此，您可以使用refs。
例如，在下面的示例中，定义要在容器的渲染生命周期中的某个位置插入的组件。无论子元素是如何嵌套的，您都可以“获取”子DOM元素，就像您试图从问题中处理document.getElementById一样。
class Parent extends React.Component {
constructor(props) {
super(props);
this.myRef = React.createRef();
}
render() {
return (
<FunctionComponent ref={this.myRef} />
);
}
}希望这能有所帮助
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/60662447
复制相关文章
相似问题
腾讯云开发者
