在反應中使用構造函數時傳遞附加參數函數

Question

我有多個輸入;我怎麼知道哪個輸入被改變了？我認爲一種方法是我可以將其他參數傳遞給我的handleChange函數。我知道我可以在jsx onChange={this.handleChange.bind(this, 'name');中做到這一點，但我不知道該怎麼做，因爲構造函數綁定了函數。

class HelloWorldComponent extends React.Component { 

    constructor(){ 
    super(); 

    this.handleChange = this.handleChange.bind(this); 

    this.state = { 
     name:"", 
     age:"" 
    } 
    } 

    render() { 
    const person = {"name":"james", "age":18}; 
    return ( 
     <div> 
     <input onChange={this.handleChange} type="text" placeholder="name" defaultValue={person.name} /><br /> 
     <input onChange={this.handleChange} type="text" placeholder="age" defaultValue={person.age} /> 
     </div> 
    ); 
    } 

    handleChange(e){ 
    // how to get name and age here? 
    console.log(e.target.value) 
    } 
} 

http://jsbin.com/cubofurihu/edit?js,console,output

Answer 1

bind不會爲函數做任何調用，它只是assignes範圍this的功能。

然後，不要寫onChange={this.handleChange.bind(this, 'name')}

但是，寫如下：

onChange={(e) => this.handleChange(e, 'name')} 

假設handleChange是：

handleChange(e, param) { 
     console.log(e.target.value); 
     console.log(param) // 'name' 
    }