事件

import React, {Component, PropTypes} from 'react';
import ReactDOM from 'react-dom';

class People extends Component {
  constructor(props){
    super(props);
    this.state = {
      name: 'sisi',
      school: 'hust',
      age: '23'
    }
  }
 handleOnfocus = (ev,varible) => {
  console.log(ev.target.placeholder);
  console.log(varible)
 }
  render(){
    return <div>
      名字：<input type='text'  onFocus={this.handleOnfocus()} placeholder='name'/><br />
      学校：<input type='text'  placeholder='school'/><br />
      年纪：<input type='text'  placeholder='age'/>
    </div>
  }
}

ReactDOM.render(
  <People name={'jianwen'} />,
  document.getElementById('example')
  )

上面代码中，onFocus={this.handleOnfocus('haha')},是表示立即执行this.handleOnfocus函数,即使没有触发onFocus,因为只有这样写onFocus={this.handleOnfocus}才表示触发focus事件就执行。 为了可以传递参数，我们修改handleOnfocus函数为下面这样：

handleOnfocus = (variable) => {
    return (ev) => {
  console.log(ev.target.placeholder);
  console.log(varible)
 }
}

并且不能写成下面的形式

handleOnfocus = (variable) => {
    return (ev,variable) => {
  console.log(ev.target.placeholder);
  console.log(varible)
 }
}