this.handleChange.bind(this) 并渲染使用

Question

我从 react bootstrap 网站上得到了这段代码 https://react-bootstrap.github.io/components/forms/ 我想知道代码中下面的用法

this.handleChange = this.handleChange.bind(这个)
value在this.state = { value: '' }; }
中的使用空
在validationState={this.getValidationState()}

validationState

以及设置两个渲染的使用，为什么不只是一个渲染，是否可以设置多个渲染

    class FormExample extends React.Component {
    constructor(props, context) {
    super(props, context);
    this.handleChange = this.handleChange.bind(this);

     this.state = {
   value: ''
   };
   }

   getValidationState() {
   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;
    }

    handleChange(e) {
    this.setState({ value: e.target.value });
    }

     render() {
     return (
     <form>
     <FormGroup
     controlId="formBasicText"
  validationState={this.getValidationState()}
>
  <ControlLabel>Working example with validation</ControlLabel>
  <FormControl
    type="text"
    value={this.state.value}
    placeholder="Enter text"
    onChange={this.handleChange}
  />
  <FormControl.Feedback />
  <HelpBlock>Validation is based on string length.</HelpBlock>
</FormGroup> </form>
    );
    }
    }

render(<FormExample />);

Answer 1

this.handleChange = this.handleChange.bind(this): 这个就是让它所以你可以在 handlechange()
通过设置一个空值，以后这个键就不会为空如果您尝试在未设置值的情况下引用它
validationState 正在作为属性
渲染不在同一个 class 所以 FormExample 正在由它之外的其他东西呈现。

希望对您有所帮助

this.handleChange.bind(this) 并渲染使用

this.handleChange.bind(this) and render use

javascript

ecma

reactjs