点击事件在实际按钮周围触发答案

【问题标题】：Click Event is triggered around the actual button点击事件在实际按钮周围触发
【发布时间】：2019-09-29 20:06:21
【问题描述】：

我正在开发 Ionic 应用程序。我有一个离子列表，其中包含离子项目的点击事件。当我单击离子列表项时，也会触发单击事件

ion-item仅在此处触发点击

ion-list红色标记显示我可以触发事件的位置

     <div>
        <ion-list *ngFor="let y of x">
            <p>Date</p>
            <ion-item *ngFor="let z of y" (click)="click(y.id)">
                {{event.title}}
            </ion-item>
        </ion-list>
    </div>

项目之间的小间隙是可点击的...为什么以及如何更改它？

解决方案

将 event.stopPropagation() 添加到点击事件中。

click(id :string){
  event.stopPropagation();
  //more code
}

【问题讨论】：

你问的是如何在段落上放置点击事件？请澄清。
点击事件只在蓝色离子项目上而不是在它周围的空白处
用 span 或 div 包裹你的文本，并在上面加上 (click)：<div (click)="click(event.id)">{{event.title}}</div>
div 上的点击事件具有相同的行为：/
你能提供一个stackblitz来显示这个问题吗？ event 是什么？

标签： javascript angular ionic-framework

【解决方案1】：

您应该停止event bubbling 以停止单击父元素：您应该为此使用event.stopPropagation()

【讨论】：

这对我有用。谢谢！我在我的问题中添加了一个带有代码的解决方案