title: React Input validation if empty or number
body: <p>I've created this method that gets the state of the calculator input and checks if its empty or not. I need help with two things:</p>
  
  <ul>
  <li>What's the cleanest way to add here a validation to check if each input is also a number and outputs and error "Input must be a number"</li>
  <li><p>Currently I have one error message that fires whether all the inputs are present or not, where what I want is for it to validate each input separately and fire an error under each one. How do I do it but still keep this function concise?</p>
  
  <pre><code>       constructor(props) {
          super(props);
          this.state = {
              price: 0,
              downP: 0,
              term: 0,
              interest: 0,
              error: ''
          };
      }
  
   handleValidation = () =&gt; {
                  const {
                      price,
                      downP,
                      loan,
                      interest,
                  } = this.state;
                  let error = '';
                  let formIsValid = true;
                      if(!price || 
                          !downP ||
                          !loan ||
                          !interest){
                          formIsValid = false;
                          error = "Input fields cannot be empty";
                      } 
  
         this.setState({error: error});
        return formIsValid;
      }
  </code></pre>
  
  <p>And then this is the error message</p>
  
  <pre><code>     &lt;span style={{color: "red"}}&gt;{this.state.error}&lt;/span&gt;
  </code></pre></li>
  </ul>