React.js - 目标容器不是DOM元素

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了React.js - 目标容器不是DOM元素相关的知识,希望对你有一定的参考价值。

试图渲染反应组件:

var wrapper = document.getElementById('wrapper');
console.log(wrapper);
ReactDOM.render(
  React.createElement(components.WrapperComponent),{modules_list:modules_list},wrapper);

给我:

错误:_registerComponent(...):目标容器不是DOM元素。

我知道当你在html文档正确加载之前尝试执行react时会抛出此错误,但我的脚本标记位于文档的底部,就在结束body标记之前。当名称不匹配时,也可能发生这种情况,但我确信我的文档中存在一个带有id'wrapper'的div。当我在console.log(包装器)时,它给了我对象,它没有未定义,所以idk为什么反应拒绝渲染它。

ps:我正在使用RequireJS require函数“导入”react组件:

requirejs(['jsx!layout/WrapperComponent'], function (WrapperComponent) {
        components.WrapperComponent = WrapperComponent;
        render();
    });

然后render()函数尝试渲染为上面显示的。

我的HTML文档的一部分:

<body class="navbar-top has-detached-right">

    <div id='wrapper'> .... </div>
答案

ReactDom.render的第二个参数应该是dom容器。但是你放了{modules_list:modules_list}。我想你的意思是

ReactDOM.render(React.createElement(components.WrapperComponent, {modules_list:modules_list}),wrapper))

以上是关于React.js - 目标容器不是DOM元素的主要内容,如果未能解决你的问题,请参考以下文章

我的代码框上带有 react & parcel 的“目标容器不是 DOM 元素”错误

未捕获的错误:_registerComponent(...):目标容器不是 DOM 元素。(...)

不变违规:当元素在 DOM 中时,目标容器不是 DOM 元素

测试 React:目标容器不是 DOM 元素

React 13.3 unmountComponentAtNode() 错误:目标容器不是 DOM 元素

测试套件无法运行。不变违规:_registerComponent(...):目标容器不是 DOM 元素