多个表单元素重用change事件处理器

在使用约束表单组件时，可以再react中重用一个事件处理器

方法一：可以使用.bind（）传递其他参数

示例：

import React from 'react';

var MyForm = React.createClass({

          getInitialState(){

                   return{

                                        given_name:"",      family_name:""   

                             }

              },

           handleChange(name,event){

                       var newState = {};

                       newState[name] = event.target.value;

                        this.setState(newState);

            },

            handleSubmit(event){

                        event.preventDefault();

                        var fullName = [

                                   'Hi',this.state.given_name,this.state.family_name 

                      ]; 

                      alert(fullName.join(" "));

                       this.refs.given_name.value="";

                       this.refs.family_name.value="";

              }, 

           render(){

                return (

                   

                      Given Name:

                     

                   

                             onChange={this.handleChange.bind(this,"given_name")}                ref="given_name" />

                 

                          onChange={this.handleChange.bind(this,"family_name")}                ref="family_name" />

                 submit

         

       )

     }

}):

export { MyForm as default }

方法二：使用DOMNode的name属性来判断需要更新哪一个组件的状态。

示例二：

上面的两个例子特别的相似，解决同样的问题，但是使用了不同的方式，React还在addon中提供了一个mixin，也可以通过这个方法解决这个问题。