我是React的新手。我在使用reactDom进行渲染时遇到了一些问题:
index.js
import ReactDOM from 'react-dom';
import A from 'components/A';
import B from 'components/B';
render(<A />, document.getElementById('A'));
render(<B />, document.getElementById('B'));
我想展示类似
的内容将B渲染到B页 问题是当我在index.js上一起定义A和B时,所以在第A页(此处没有elementId B),它将显示如下的错误,因为React在第A页上没有elementId B
无效的违规注册组件目标容器不是DOM元素
按React and Browserify Register Component Error之类的路径检查也可以修复它,或者在调用elementid
之前检查render
(是否存在)。
我想知道这是否是解决此类案件的正确方法,还是有其他办法?
答案 0 :(得分:0)
尝试这样的事情:
if (document.getElementById('A')) {
render(<A />, document.getElementById('A'));
}
if (document.getElementById('B')) {
render(<B />, document.getElementById('B'));
}
这是解决您问题的最简单,最简单的方法(它不是最干净,也不是最好的解决方案,但在学习React以及它如何与DOM一起工作时最容易理解)。如果找不到<A />
容器,则不会呈现A
,如果找不到<B />
容器,则不会呈现B
。