本文介绍了如何在“离子按钮Ioinic 4"中禁用/消除离子波纹效应?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我需要在"ion-button"中禁用默认的ion-ripple-effect
.
I need to disable the default ion-ripple-effect
in the `ion-button'.
<ion-button>
<ion-icon slot="icon-only" name="star"></ion-icon>
</ion-button>
我无法根据需要禁用pointer-events
.
I can't disable the pointer-events
as I need it.
PS:我已经参考了以下帖子,但找不到适用于Ionic 4的适当解决方案.
PS: I've referred the following posts and could not find a proper solution for Ionic 4.
- How to remove click effect of an ion-item
- Disable ripple effect on element
推荐答案
--ripple-color
CSS变量可用于关闭波纹效果.
--ripple-color
CSS variable could be used to turn off the ripple effect.
<ion-button class="no-ripple">
<ion-icon slot="icon-only" name="trash"></ion-icon>
</ion-button>
例如,我们可以在按钮上设置--ripple-color: transparent
,以有效地禁用效果.
For example, we could set --ripple-color: transparent
on the button, to effectively disable the effect.
.no-ripple {
--ripple-color: transparent;
}
请参考 https://github.com/ionic-team/ionic/issues/19648
这篇关于如何在“离子按钮Ioinic 4"中禁用/消除离子波纹效应?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!