onChange不能使用this.handleInputChange

Question

我不明白为什么onChange={this.handleInputChange}在我返回{this.renderCareerPositions()}时无法正常工作。 SingleInput呈现表单中的所有输入字段，但我无法输入。

路径：handleInputChange

handleInputChange(event) {
    const target = event.target;
    const value = target.type === 'checkbox' ? target.checked : target.value;
    const name = target.name;
    console.log("click");
    this.setState({
      [name]: value
    });
  }

renderCareerPositions(props) {

  if(0 < this.state.data.length) {
    console.log(this.state.data);
    const careerPositions = this.state.data.map((position) =>
    <li key={position['position.uniqueId']}>
      <SingleInput
        inputType={'text'}
        title={'Company name'}
        name={position['position.uniqueId']}
        controlFunc={this.handleInputChange}
        content={position['position.company']}
        placeholder={'Company'}
        bsSize={null}
      />
    </li>
  );
  return (
    <ul>
      {careerPositions}
    </ul>
  )
}
}

render() {
  return (
    <form className='careerHistoryForm' onSubmit={this.handleFormSubmit}>
      {this.renderCareerPositions()}
    </form>
  );
}
}

路径SingleInput

const SingleInput = (props) => (
  <FormGroup bsSize={props.bsSize} validationState={props.error ? 'error' : null}>
    <ControlLabel>{props.title}</ControlLabel>
    <FormControl
      className="form-input"
      name={props.name}
      type={props.inputType}
      value={props.content}
      onChange={props.controlFunc}
      placeholder={props.placeholder}
    />
    {props.error ? <HelpBlock>{props.error}</HelpBlock> : '' }
  </FormGroup>
);