Aarni
62 lines
1.6 KiB
JavaScript
62 lines
1.6 KiB
JavaScript
ReactDOM.render(<h1>Hello World</h1>, document.getElementById("react-test"));
|
|
/*
|
|
var CommentBox = React.createClass
|
|
({
|
|
loadCommentsFromServer: function() {
|
|
$.ajax({
|
|
url: this.props.url,
|
|
dataType: 'json',
|
|
cache: false,
|
|
success: function(data) {
|
|
this.setState({data: data});
|
|
}.bind(this),
|
|
error: function(xhr, status, err) {
|
|
console.error(this.props.url, status, err.toString());
|
|
}.bind(this)
|
|
});
|
|
},
|
|
handleCommentSubmit: function(comment)
|
|
{
|
|
var comments = this.state.data;
|
|
// Optimistically set an id on the new comment. It will be replaced by an
|
|
// id generated by the server. In a production application you would likely
|
|
// not use Date.now() for this and would have a more robust system in place.
|
|
comment.id = Date.now();
|
|
var newComments = comments.concat([comment]);
|
|
this.setState({data: newComments});
|
|
$.ajax
|
|
({
|
|
url: this.props.url,
|
|
dataType: 'json',
|
|
type: 'POST',
|
|
data: comment,
|
|
success: function(data) {
|
|
this.setState({data: data});
|
|
}.bind(this),
|
|
error: function(xhr, status, err) {
|
|
this.setState({data: comments});
|
|
console.error(this.props.url, status, err.toString());
|
|
}.bind(this)
|
|
});
|
|
},
|
|
getInitialState: function()
|
|
{
|
|
return {data: []};
|
|
},
|
|
componentDidMount: function()
|
|
{
|
|
this.loadCommentsFromServer();
|
|
setInterval(this.loadCommentsFromServer, this.props.pollInterval);
|
|
},
|
|
render: function()
|
|
{
|
|
return (
|
|
<div className="commentBox">
|
|
<h1>Comments</h1>
|
|
<CommentList data={this.state.data} />
|
|
<CommentForm onCommentSubmit={this.handleCommentSubmit} />
|
|
</div>
|
|
);
|
|
}
|
|
});
|
|
*/ |