如何使用React-bootstrap進行多輸入表單驗證？

我是新的React，我只是想與多個輸入與react-bootstrap實現窗體驗證。我沒有想法如何做到這一點。我很困惑如何將驗證狀態與React-bootstrap連接在一起感謝.... 。如何使用React-bootstrap進行多輸入表單驗證？

import React,{Component} from 'react'; 
import {FormControl,FormGroup,ControlLabel,HelpBlock} from 'react-bootstrap' 

class SignUp extends Component{ 
    getValidationState =() => { 
     console.log('Am I called'); 
     const length = this.state.value.length; 
     if (length > 10) return 'success'; 
     else if (length > 5) return 'warning'; 
     else if (length > 0) return 'error'; 
     return null; 
    } 
    render(){ 
     return(
      <div style={{marginTop:'65px'}} className="container"> 
       <form > 
        <FieldGroup 
         id="formControlsText" 
         type="text" 
         label="Text" 
         placeholder="Enter text" 
        /> 
        <FieldGroup 
         id="formControlsEmail" 
         type="email" 
         label="Email address" 
         placeholder="Enter email" 
        /> 

        <FieldGroup 
         id="formControlsEmail" 
         type="email" 
         label="Email address" 
         placeholder="Enter email" 
        /> 

       </form> 
      </div> 
     ) 
    } 
} 

function FieldGroup({ id, label, help, ...props }) { 
    return (
     <FormGroup controlId={id} validationState="success"> 
      <ControlLabel>{label}</ControlLabel> 
      <FormControl {...props} /> 
      {help && <HelpBlock>{help}</HelpBlock>} 
     </FormGroup> 
    ); 
} 


export default SignUp

來源

2017-10-28 Nane