React Form字段格式错误

Question

当我尝试输入任何数据时，我的输入字段会崩溃我认为字段类在更改功能上正在更改。就像表单控件类在输入数据时没有持有。我是使用react js创建和开发事物的新手。我使用atom作为编辑器。我希望有人能找到问题。

      render() {
        const errors = validate(this.state.companyname, this.state.intro,this.state.aboutus,this.state.service,this.state.address,this.state.instruction);
        const isDisabled = Object.keys(errors).some(x => errors[x]);
        return (
          <div>
          <div>
          <b>Webgen</b>
          </div>
          <div class="App">
          <ul class="progress-indicator">
  <li class="completed"> <span class="bubble"></span> Step 1. </li>
  <li class="completed"> <span class="bubble"></span> Step 2. </li>
  <li> <span class="bubble"></span> Step 3. </li>
  <li> <span class="bubble"></span> Step 4. </li>
</ul>
<p>Step 2</p>
          <header>
          <h1>About Website</h1>
        </header>
        <form onSubmit={this.handleSubmit}>
        <div class="row">
        <div class="col-md-10">
            <input
              className={errors.companyname ? "error" : "" }
              type="text"
              placeholder="Your Comapny Name/Bussiness Name"
              value={this.state.companyname}
              onChange={this.handlecompanynameChange}
              class="form-control"
            /><br/></div>
             <div class="col-md-2"><button class="btn btn-primary">Upload Logo</button></div></div>
            <input
              className={errors.intro ? "error" : ""}
              type="text"
              placeholder="Company Bussiness Intro"
              value={this.state.intro}
              onChange={this.handleintroChange}
              class="form-control"
            /><br/>
            <input
              className={errors.aboutus ? "error" : ""}
              type="text"
              placeholder="About Us Text"
              value={this.state.aboutus}
              onChange={this.handleaboutusChange}
              class="form-control"
            /><br/>
            <input
              className={errors.service ? "error" : ""}
              type="text"
              placeholder="Your Service Product"
              value={this.state.service}
              onChange={this.handleserviceChange}
              class="form-control"
            /><br/>
            <input
              className={errors.address ? "error" : ""}
              type="text"
              placeholder="Your Address"
              value={this.state.address}
              onChange={this.handleaddressChange}
              class="form-control"
            /><br/>
            <input
              className={errors.instruction ? "error" : ""}
              type="text"
              placeholder="Adittional Instruction"
              value={this.state.instruction}
              onChange={this.handleinstructionChange}
            /><br/>
            <Link to="/mokeup3" ><button class="btn btn-primary" disabled={isDisabled}>Sign up</button></Link>
          </form>
          </div>
          <div>
        <footer>
        <b>Website Wizard</b>
        </footer>
        </div>
        </div>
        )
      }
    }
export default mokeup2;