首页 > 解决方案 > 如何消除离子项目的点击效果

问题描述

我想删除一个 ion-item 的点击效果。我使用了 --background-activated 和 --ripple-color 但没有任何反应。

.no-click{
--background-activated: transparent;
--ripple-color: transparent;
}

<ion-item class="no-click">
<ion-avatar slot="start">
<img [src]="img">
</ion-avatar>
<ion-label>{{name}}</ion-label>
</ion-item>

如何消除离子项目的点击效果?

标签: ionic-frameworkionic4

解决方案


只需提供 pointer-events:none css 即可禁用点击。

 .no-click {
   pointer-events:none; //This makes it not clickable
 }


<ion-item class="no-click">
    <ion-avatar slot="start">
        <img [src]="img">
        </ion-avatar>
     <ion-label>{{name}}</ion-label>
  </ion-item>

推荐阅读