Javascript 如何在reactjs上调用输入值

这是我在react上的表格。。。我需要获取输入值，但每当我检查网络时，以下内容未定义，请帮助我添加数据，但为空

          <td>Name</td>
          <td>
          <input type="text"

                value={this.props.Employee_Name} 
                 onChange={(e) => this.handleChange(e)}
                /> 
          </td>
          </tr>
          <tr>
          <td>Address</td>
          <td>
           <input type="text"

                 name="Address"
                 value={this.props.Address}/>
          </td>
          </tr>
          <tr>
          <td>Department</td>
          <td>
           <input type="text"
                   value={this.props.Department}
          /> 
          </td>
          </tr>
          </tbody>
          </table>

      </div>
      </div>
      <div className="modal-footer">
        <input type="submit" className="btn btn-info"  onClick = { this.handleSubmit.bind(this, this.Employee_Name ,this.Address ,this.Department)}  value =" Add Employee"/>
        <button type="button" className="btn btn-default" data-dismiss="modal">Close</button>
      </div>
     </form>

---

在

handleSubmit

函数中，将值传递为

onClick = { this.handleSubmit.bind(this, this.Employee_Name ,this.Address ,this.Department)} 

但是我没有看到定义了并包含相应输入值的

this.Employee\u Name、this.Address、this.Department

。我认为你应该传递道具，在

地址
和
部门
上进行
onChange

试一试

用反应的方式做这件事

您需要将道具设置为状态，并按如下方式呈现组件窗体：

<input type="text"
                   value={this.state.form.department}
         onChange={(e)=>this.changed(e,'department')} 
/> 

在组件状态下按用户设置表单的输入值。

现在，对于post请求数据：

changed(e,key){
  var state=Object.assign({},this.state);
  state.form[department]=e.target.value;
  this.setState({state})
}

const data = {
      'Employee_Name': this.state.form.name,
      'Address':this.state.form.address,
      'Department': this.state.department
    }

或者当你在做的时候：

    <input type="submit" className="btn btn-info"  
onClick = { this.handleSubmit.bind(this, this.state.form.employee_Name ,this.state.form.address ,this.state.form.department)}  
value =" Add Employee"/>


示例1
此示例在用户键入时将输入值存储到props。
类名将用于映射到状态值

内部渲染方法：

<input
    type="text"
    className="Employee_Name"
    onChange={this.handleKeyUp.bind(this)}
/>

<input
    type="text"
    className="Address"
    onChange={this.handleKeyUp.bind(this)}
/>

<input
    type="text"
    className="Department"
    onChange={this.handleKeyUp.bind(this)}
/>
<button
    type="submit"
    onClick={this.handleSubmit.bind(this)}
    >
    SUMBUT
</button>

控制台中有错误吗？Uncaught TypeError：将循环结构转换为JSONI如果您的道具被正确更改，您应该看到handleSubmit函数中的值，看到您在那里得到的正确更改吗？你是什么意思？你在name上有一个onChange函数，例如，
value={this.props.Employee\u name}onChange={（e）=>this.handleChange（e）}
，如果正确编写handleChange函数来更新父级中的值，然后将该值作为Employee_Name传递给当前组件，propsive也尝试过，但输入仍然是未定义的
handleSubmit=（Name，address，department）=>{console.log（this.props.Employee_Name）
我认为这将适用于更新部分，…我正在添加员工..我尝试了put方法及其工作..您能否指定您面临的问题？我正在添加另一名员工，但在添加时会添加空值是因为您尝试了错误的顶部拾取表单值。您仍在尝试吗更新道具，而不是状态？因为我必须说道具应该是只读的！
    <input type="submit" className="btn btn-info"  
onClick = { this.handleSubmit.bind(this, this.state.form.employee_Name ,this.state.form.address ,this.state.form.department)}  
value =" Add Employee"/>

<input
    type="text"
    className="Employee_Name"
    onChange={this.handleKeyUp.bind(this)}
/>

<input
    type="text"
    className="Address"
    onChange={this.handleKeyUp.bind(this)}
/>

<input
    type="text"
    className="Department"
    onChange={this.handleKeyUp.bind(this)}
/>
<button
    type="submit"
    onClick={this.handleSubmit.bind(this)}
    >
    SUMBUT
</button>

handleKeyUp(e) {
   let inputType = e.target.className
   let value = e.target.value
   let obj = {}
   obj[inputType] = value

   this.setState(obj)

    return
}


handleSubmit(e) {
    e.preventDefault()

    const { name, address, department} = this.state
    // do your fetch here

}