React and Multiple form fields

Question

I was reading documentation on \"onChange\" and I am curious as to what I would do if my forum has multiple fields like select boxes, checkboxes, text areas and inputs? Do I

Answer 1

Some of my friends were discussing this today. The solution proposed by @JunleLi is great but it breaks Purerender which forces a re-render of all subcomponents every time a character it typed into one of the fields as it is regenerating the function.

Here is an example of our solution. We're still not sure if we're completely happy with it but it ultimately creates the function once and caches it.

I'd love to hear any feedback.

handleChange(key) {
    if(!this.changeHandlers) this.changeHandlers = {};
    return this.changeHandlers[key] || (this.changeHandlers[key] = event => this.setState({[key]: event.target.value}));
},

render() {
    return (
        

          
          
{JSON.stringify(this.state, null, 4)}
        
    );
}