Uncaught error:_registerComponent(…): target container is not 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 it, the this inside the method is $.ajax({this object}), and the bind incoming this should be the component. You can console the output and 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 of not finding DOM nodes.
To:
ReactDOM.render(< SessionPage url=”/api/session”/> , document.getElementById(“App”));