如何在禁用状态下自定义ion-range?
How to customize ion-range in disabled state?
有没有办法自定义 ion-range 禁用 属性 活动?
使用 ion-range
作为视觉提示来显示用户在(订购)过程中的位置。用户将没有更改范围的选项,因此添加了 disabled
属性。此 属性 覆盖所有自定义颜色 css。但是我找不到 disabled
css 来再次将其覆盖为所需的结果。
这是ion-range
的习俗css。副色就是下面看到的绿色。
我们能否通过用户无法控制滑块的ion-range
实现下面想要的结果?
<ion-range value="{{ range }}" min="0" max="2" color="secondary" disabled></ion-range>
结果(禁用属性)
想要的结果(没有禁用属性)
编辑
由于您无法更改已禁用的 属性 并且它是 css 变量,我们希望在没有指针或用户触摸控制的情况下显示滑块。
pointer-events:none
阻止您与其互动
<ion-range style="pointer-events: none;"value="{{ range }}" min="0" max="2" color="secondary"></ion-range>
:) 我的最终答案
只需添加样式="pointer-events: none;"
有没有办法自定义 ion-range 禁用 属性 活动?
使用 ion-range
作为视觉提示来显示用户在(订购)过程中的位置。用户将没有更改范围的选项,因此添加了 disabled
属性。此 属性 覆盖所有自定义颜色 css。但是我找不到 disabled
css 来再次将其覆盖为所需的结果。
这是ion-range
的习俗css。副色就是下面看到的绿色。
我们能否通过用户无法控制滑块的ion-range
实现下面想要的结果?
<ion-range value="{{ range }}" min="0" max="2" color="secondary" disabled></ion-range>
结果(禁用属性)
想要的结果(没有禁用属性)
编辑
由于您无法更改已禁用的 属性 并且它是 css 变量,我们希望在没有指针或用户触摸控制的情况下显示滑块。
pointer-events:none
阻止您与其互动
<ion-range style="pointer-events: none;"value="{{ range }}" min="0" max="2" color="secondary"></ion-range>
:) 我的最终答案
只需添加样式="pointer-events: none;"