时间戳

首页 > 解决方案 > 按钮 onclick 事件无法正常工作

javascript - 按钮 onclick 事件无法正常工作

问题描述

在我的反应网络应用程序中，我有一个搜索按钮来从 API 获取数据。

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

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

但我的要求是将搜索图标作为按钮，所以我改变了这段代码，如下所示。

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

即当我使用按钮标签时，它不起作用。为什么？

相同的代码适用于我代码中的另一个组件。我已经在两个组件中导入了物化库。请让我知道是什么问题以及如何解决？

标签： javascripthtmlreactjsjsx

解决方案

尝试在材料图标以外的按钮上使用事件。不过，在材质图标上创建事件不是问题。如果这不起作用，请尝试检查按钮并检查按钮顶部是否有元素阻止图标收听点击。

<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

推荐阅读