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

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), // If you don't bind, the this variable inside the method is $.ajax({this object}), and the this variable passed in by bind should be the component. You can console output to see.
                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>

It’s just a problem that DOM nodes can’t be found

Change to:

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

Similar Posts: