title: React don't render answer
body: <p>Thanks for visiting my question.
  I am making a simple calculator via react.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="true">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.6.2/react.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/15.6.2/react-dom.min.js"&gt;&lt;/script&gt;
  &lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;title&gt;Task 4&lt;/title&gt;
          &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.6.1/react.js"&gt;&lt;/script&gt;
          &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.6.1/react-dom.js"&gt;&lt;/script&gt;
          &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.38/browser.js"&gt;&lt;/script&gt;
      &lt;/head&gt;
  &lt;body&gt;
  &lt;div id="calculator"/&gt;
  &lt;script type="text/babel"&gt;
      var Calculate=React.createClass({
          getInitialState:function(){
              return{
                   firstvalue: 0, secondvalue: 0, operation : "+", answer: 0
                   }
          },
          handleFirstValueChange(event)
          {
              var localvalue=event.target.value.replace(/\s+/g, ' ').trim()
              this.setState({
                  firstvalue:localvalue
              });
              this.Answer()
          },
          handleSecondValueChange(event)
          {
              var localvalue=event.target.value.replace(/\s+/g, ' ').trim()
              this.setState({
                  secondvalue:localvalue
              })
              this.Answer()
          },
          handleSum(event)
          {
              this.setState({
                  operation:"+",
              })
              this.Answer()
          },
          handleSub(event)
          {
              this.setState({
                  operation:"-"
              })
              this.Answer()
          },
          handleMul(event)
          {
              this.setState({
                  operation:"*"
              })
              this.Answer()
          },
          handleDiv(event)
          {
              this.setState({
                  operation:"/"
              })
              this.Answer()
          },
          Answer()
          { 
              switch(this.state.operation)
              {
                  case "+" :
                  this.setState({
                      answer:Number(this.state.firstvalue)+Number(this.state.secondvalue)
                      })
                      break; 
                  case "-" :
                  this.setState({
                      answer:Number(this.state.firstvalue)-Number(this.state.secondvalue)
                      }) 
                      break;
                  case "*" :
                  this.setState({
                      answer:Number(this.state.firstvalue)*Number(this.state.secondvalue)
                      })
                      break;
                  case "/":
                  this.setState({
                      answer:Number(this.state.firstvalue)/Number(this.state.secondvalue)
                      }) 
                      break;
              }
          },
          render:function(){
              return(
              &lt;div&gt;
              &lt;input type="text" className="search-field" onChange={this.handleFirstValueChange}/&gt;
              &lt;input type="text" className="search-field" onChange={this.handleSecondValueChange}/&gt;
              &lt;div/&gt;
              &lt;button onClick={this.handleSum}&gt;
              Сложить
              &lt;/button&gt;
              &lt;button onClick={this.handleSub}&gt;
              Вычесть
              &lt;/button&gt;
              &lt;button onClick={this.handleMul}&gt;
              Умножить
              &lt;/button&gt;
              &lt;button onClick={this.handleDiv}&gt;
              Поделить
              &lt;/button&gt;
  
              &lt;div&gt;{this.state.firstvalue} {this.state.operation} {this.state.secondvalue} ={this.state.answer} &lt;/div&gt;
              &lt;/div&gt;
              )}
      });
      ReactDOM.render(
               &lt;Calculate/&gt;,
               document.getElementById("calculator")
           );
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I want to render an answer when I edit the first or second field. But it renders only after the press button or editing field again. I don't see how to fix, I think it can be with render, but I am called an Answer() function on these 2 fields and it does not give me a result. I am trying to link Answer() with the event in render but it did not give success. 
  Thanks a lot.
  First 2 scr it's stackoverflow.
  I want this result. Edit field, or button and give answer immediately.</p>