Javascript 按钮onclick事件工作不正常

在我的react web应用程序中，我有一个从API获取数据的搜索按钮

如果我把下面的代码，它的工作

<div className="col m1 s1 ">             
<i className="material-icons" onClick={ ()=>this.handleJobSearchChange() } >search </i>
</div

this.handleJobSearchChange（）}>search
搜寻
尝试使用按钮上的事件而不是材质图标。不过，在材质图标上创建事件并不是问题。如果这不起作用，请尝试检查按钮，并检查按钮顶部是否存在阻止图标收听单击的元素

<div className="col m1 s1 ">          
<button className="btn btn-active grey waves-effect waves-teel"onClick={ ()=>this.handleJobSearchChange() }>
<i className="material-icons" >search </i>
</button>
</div


this.handleJobSearchChange（）}>
搜寻
onClick处理程序应该与按钮类名相关联。例如，第一个按钮类“btn”如下所示：

btn.onClick {
 ()=>this.handleJobSearchChange()
}

这个问题已经解决了

当我添加e.preventDefault（）时；语句到onclick函数

 handleJobSearchChange= (e)=>
      {
       e.preventDefault(); 
.......some code
}

感谢所有给您的回复
@Herohtar我已经给了与之相关的onclick事件您在
内的
标记上设置了
onclick
。那是行不通的；它必须进入
标记本身。@问题是当我在该组件中添加按钮标记时。相同的第二个代码在另一个组件中工作，更改了与按钮关联的单击事件，但不适用于mecan您可以在codesandbox中重现该问题。所以我们可以检查它，并在我点击它时给你解决方案，返回主页，所以无法检查那里发生了什么。我们尝试检查元素并确保按钮顶部没有元素？这部分放在单独的div中，然后是如何发生的？通过在onclick处理程序函数上添加e.preventDefault（）解决了这个问题
 handleJobSearchChange= (e)=>
      {
       e.preventDefault(); 
.......some code
}