Forum.js
//
var Forum = React.createClass({
getInitialState: function () {
return {
allAnswers: {
"1" : {
body: " this is first question",
correct: false
},
"2" : {
body: " Here is another question",
correct: false
},
"3" : {
body: " Is react is good ",
correct: false
},
}
}
},
render: function() {
return (
<div>
<ForumHeader />
<div>
<ForumQuestion />
<hr />
<ForumAnswers allAnswers={this.state.allAnswers} />
<hr />
<h4> Add an Answer </h4>
<ForumAddAnswerBox onAddAnswer={this._onAddAnswer } />
</div>
</div>
);
},
_onAddAnswer: function(answerText) {
ForumDispatcher.dispatch({
actionType: 'FORUM_ANSWER_ADDED',
newAnswer: answerText
});
}
});
---------
ForumAddAnswerBox.js
//
var ForumAddAnswerBox = React.createClass({
getInitialState: function() {
return {
value: ' '
};
},
_addAnswer: function() {
this.props.onAddAnswer(this.state.value);
console.log(this.state.value);
},
render: function() {
return (
<div>
<textarea id="addAnswer"
className="col-md-6 col-xs-8"
onChange = {this._onChange } >
</textarea>
<input type="button"
className="btn btn-primary"
value="Add"
onClick= { this._addAnswer }
/>
</div>
);
},
_onChange: function(event) {
this.setState({
value: event.target.value
});
},
});