react函数组件div点击事件参数e打印是undefined怎么办

在 React 函数组件中，事件参数 e 是由 React 自动传递给事件处理函数的，在事件处理函数中可以直接使用。如果你的代码中 e 打印出来是 undefined，可能是以下几个原因：

1. 事件处理函数没有正确绑定 this

在事件处理函数中，如果需要使用组件实例的属性或方法，需要正确绑定 this。可以使用箭头函数或在构造函数中绑定 this。例如：

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.handleClick = this.handleClick.bind(this);
  }

  handleClick(e) {
    console.log(e); // 此时 e 不会是 undefined
  }

  render() {
    return <div onClick={this.handleClick}>Click me</div>;
  }
}

2. 事件处理函数没有接收参数

在事件处理函数中，如果没有显式声明参数，e 就会是 undefined。可以通过以下方式解决：

class MyComponent extends React.Component {
  handleClick = (e) => {
    console.log(e); // 此时 e 不会是 undefined
  }

  render() {
    return <div onClick={this.handleClick}>Click me</div>;
  }
}

或者：

class MyComponent extends React.Component {
  handleClick(e) {
    console.log(e); // 此时 e 不会是 undefined
  }

  render() {
    return <div onClick={(e) => this.handleClick(e)}>Click me</div>;
  }
}

以上两种方式都可以确保事件处理函数接收到事件参数 e。