无法使用React + Jquery

时间:2018-08-09 18:55:16

标签: jquery reactjs drop-down-menu bootstrap-4

这是下拉菜单的Bootstrap 4代码:

<div className="btn-group show">
  <button className="btn btn-secondary btn-sm dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true" data-type="fontFamily" style="width: 100px;">Avenir Next</button>
  <div className="dropdown-menu">
       <a className="dropdown-item" href="#" style="font-family: &quot;Avenir Next&quot;;">Avenir Next</a><a className="dropdown-item" href="#" style="font-family: Baghdad;">Baghdad</a>
       <a className="dropdown-item" href="#" style="font-family: Helvetica;">Helvetica</a><a class="dropdown-item" href="#" style="font-family: Monotype;">Monotype</a>
       <a className="dropdown-item" href="#" style="font-family: &quot;Times New Roman&quot;;">Times New Roman</a>
       <a className="dropdown-item" href="#" style="font-family: &quot;Lucida Grande&quot;;">Lucida Grande</a>
  <div className="dropdown-divider"></div>
       <a className="dropdown-item" href="#" style="font-family: &quot;Lucida Grande&quot;;">Lucida Grande</a>
 </div>

这是反应部分:

componentDidMount(){

  $('.dropdown-item').click((e) => {
      console.log('text', $(e.currentTarget).text());
   });

}

单击下拉菜单时,没有任何反应。我不知道为什么。

请帮助

1 个答案:

答案 0 :(得分:-1)

假设您使用的是JSX,

class="..."应该为className="..."

也引起了一个问题,为什么您要使用jquery + React ...