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

Question

正在尝试渲染一个 React 组件：

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

给我：

Error: _registerComponent(...): Target container is not a DOM element.

我知道当您尝试在正确加载 html 文档之前执行反应时可能会抛出此错误，但我的脚本标签位于文档底部，就在结束正文标签之前。当名称不匹配时也可能发生这种情况，但我确定我的文档中存在 ID 为 'wrapper' 的 div。当我 console.log(wrapper) 它给我对象时，它 不是未定义的 ，所以我想知道为什么反应拒绝渲染它。

ps：我是 "importing" 具有 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>

Answer 1

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

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

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

React.js - Target container is not a DOM element

javascript

requirejs

reactjs