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”));