Javascript --是否可以检测使用React单击的元素的ID？

我希望在单击菜单项时使用相同的事件处理程序

在vanilla JavaScript中，事件处理程序“this”值将指向元素，您可以简单地使用

this.id

，这是如何在React中完成的

clickHandler2和clickHandler3我想成为一个事件处理程序。唯一不同的是单击的元素

代码如下：

import React from 'react';
import $ from 'jquery';

class MobileMenu extends React.Component {
  constructor (props) {
    super(props);
    this.clickHandler1 = this.clickHandler1.bind(this);
    this.clickHandler2 = this.clickHandler2.bind(this);
    this.clickHandler3 = this.clickHandler3.bind(this);
    this.state = {
      current_item: 'nav_fave'
      previous_item: null
    };
  }

  clickHandler1 () {
    this.toggleMenu();
  }

  clickHandler2 () {
    // MenuPage.flip('fave');
    this.toggleMenu();
    this.toggleMarker($A.el('#nav_fave'));
  }

  clickHandler3 () {
    // MenuPage.flip('splash');
    this.toggleMenu();
    this.toggleMarker($A.el('#nav_splash'));
  }

  toggleMarker (current_item) {

    this.setState({
      current_item: current_item
    });

    if ((this.previous_item !== undefined) && (this.previous_item !== current_item)) {
      this.previous_item.style.borderBottom = '';
    }
    if (this.previous_item !== current_item) {
      current_item.style.borderBottom = '3px solid #31baed';
    }
    this.previous_item = current_item;
  }

  toggleMenu () {
    if (window.getComputedStyle($A.el('#top_menu_list'), null).display === 'block') {
      $('#icon_bars').toggleClass('active');
      $('#top_menu').slideToggle();
    }
  }
  // ... snip 
}

export default MobileMenu

---

您可以传递事件参数并使用其

target

属性：

clickHandler2 (e) {
    var id = e.target.id;
}

顺便说一句，

这个

在您的例子中就是

类

本身

例如：

类应用程序扩展了React.Component{
建造师（道具）{
超级（道具）；
this.handleChange=this.handleChange.bind（this）；
}
手变（e）{
const{id，value}=e.target；
log（'id为-'+id+'，值为：'+value）；
}
render（）{
返回(
);
}
}
ReactDOM.render（，document.getElementById（'root'））
由于您使用的是
jQuery
选择器，您确定没有忘记
此.id
前面的
#
？示例：
this.toggleMarker（$A.el（'#'this.id））
您是否也尝试过查看
this.id
返回的内容，可能是
console.log（this.id）
或
控制台日志（此）以确保其目标/返回您期望的内容？