在api中的控制台日志上获取数据后,如何查看数据?

时间:2019-04-21 23:11:31

标签: reactjs api

我开始学习reactjs,我想在输入字段中输入文本并在控制台日志上显示数据后查看表上的数据。如何显示输入到页面的所有数据?

  

onAdd(员工姓名,员工年龄,员工工资){
  console.log(employee_name,employee_age,employee_salary);}

我希望在页面的输入字段中显示输入的数据。谢谢

1 个答案:

答案 0 :(得分:0)

这应该有效:

import React, { Component } from 'react';

class EmployeeInput extends Component {
  state = {
    employee_name: '',
    employee_age: '',
    employee_salary: '',
  };
  handleChange = e => {
    const { name, value } = e.target;
    this.setState({ [name]: value });
  };
  render() {
    return (
      <form>
        <div>
          <label>
            employee_name
            <input name="employee_name" type="text" onChange={this.handleChange} />
          </label>
          Value: {this.state.employee_name}
        </div>
        <div>
          <label>
            employee_age
            <input name="employee_age" type="text" onChange={this.handleChange} />
          </label>
          Value: {this.state.employee_age}
        </div>
        <div>
          <label>
            employee_salary
            <input name="employee_salary" type="text" onChange={this.handleChange} />
            Value: {this.state.employee_salary}
          </label>
        </div>
      </form>
    );
  }
}

这是一个正在运行的示例:https://stackblitz.com/edit/react-jl2skw?file=index.js