react input用同一个方法获取不同输入框的值的方法

react中表单要获取用户输入的各个不同的input框的输入值一般都是每个输入框定义一个方法，如果输入框多的话要定义很多方法，这种比较雍余，现在

可以利用es6的方法将每个输入框的方法同一一个方法，从而获取不同输入框的值，代码如下：

class Login extends React.Component{
     constructor (props){
          super(props);
          this.state = {
               username:'',
               password:'',
          }
     }


这是登录需要输入表单的用户名和密码，

<input type="text"
       name = 'username'
       className="form-control"
       placeholder="请输入用户名"
       onChange={e =>this.onInputChange(e)}
/>

<input type="password"
       name = 'password'
       className="form-control"
       placeholder="请输入密码"
       onChange={e =>this.onInputChange(e)}
/>

在这里密码和用户名输入框采用同一个方法这里，值不过在input框中各自定义一个name属性，分别表示username、password这样在方法onInputChange中inputName就是


分别是state中的username、password这样就节约了很多代码，es中变量名可以是个变量用中括号包起来这样就能分别代表各input框中的变量了

onInputChange(e){
     //es6变量名是一个变量
     let  inputValue = e.target.value,
          inputName = e.target.name
     this.setState({
          [inputName]:inputValue
     })
}