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

简介: Uncaught Error: _registerComponent(...): Target container is not a DOM element var SessionPage = React.

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

<script type="text/babel">
    var SessionPage = React.createClass({

        getInitialState: function () {
            var context = {
                context: {}
            };
            return context;
        },

        componentDidMount: function () {
            this.serverRequest = $.ajax({
                url: this.props.url,
                data: {},
                type: 'GET',
                dataType: 'json',
                success: function (data) {
                    this.setState({
                        context: data
                    })
                }.bind(this), // 修改bind()前的函数内部this变量指向。if 不bind的话,方法内部的this 就是 $.ajax({这个对象}), bind传入的this应该是组件。 可以console 输出一下看看。
                error: function (msg) {
                    console.log("error:" + msg);
                }.bind(this)
            })
        },

        componentWillUnmount: function () {
            this.serverRequest.abort()
        },


        render: function () {
            var creatItem = function (it) {
                return (<code>JSON.stringify(it)</code>)
            };

            return (
                    <div>{creatItem(this.state.context)}</div>
            );
        }
    });

    ReactDOM.render(<SessionPage url="/api/session"/>);
</script>

就是一个找不到DOM节点的问题。

改成:

ReactDOM.render(<SessionPage url="/api/session"/>, document.getElementById("App"));

相关文章
|
4天前
|
JavaScript
document load 和 document ready 有什么区别
document load 和 document ready 有什么区别
52 0
【已解决】Error: Element type is invalid: expected a string (for built-in components) or a class/function
Error: Element type is invalid: expected a string (for built-in components) or a class/function
2356 0
【已解决】Error: Element type is invalid: expected a string (for built-in components) or a class/function
|
10月前
Unknown custom element: <add-employee> - did you register the component correctly? For red cursive c
原因: 1.组件名没写对(导入和注册不对应) 2.components少写了个s 3.组件命名最好是驼峰命名 4.导入时语法错误 5.代码中有两个components,后一个的值把前一个覆盖了 6.组件直接循环套用了
|
4天前
'WebDriver' object has no attribute 'find_element_by_tag_name'
'WebDriver' object has no attribute 'find_element_by_tag_name'
126 0
|
4天前
|
JavaScript 前端开发
document load 和 document ready 的区别
document load 和 document ready 的区别
29 0
|
4天前
|
JavaScript 前端开发 UED
深入理解 Document Load 和 Document Ready 的区别
深入理解 Document Load 和 Document Ready 的区别
34 0
|
5月前
|
JavaScript
[Vue warn]: Unknown custom element: <Top> - did you register the component correctly?
[Vue warn]: Unknown custom element: <Top> - did you register the component correctly?
|
6月前
|
JavaScript
vue 报错-Module not found: Error: Can't resolve 'element-plus' in '
vue 报错-Module not found: Error: Can't resolve 'element-plus' in '
102 1
|
6月前
|
JavaScript
Element UI报错:Unknown custom element: <el-menu>
Element UI报错:Unknown custom element: <el-menu>
64 0
|
9月前
|
JavaScript
element-plus loading用法
Element Plus 是一个 Vue.js 2.0 UI 库,它提供了一系列的组件和工具,可以用于构建 Web 应用程序。其中之一就是 loading 组件。loading 组件可以让用户在等待数据加载时看到一个过渡动画。
344 0