Blazor更改验证的默认CSS类名称 [英] Blazor Change Validation default css class names
问题描述
我正在尝试使用Microsoft Blazor,在处理表单和验证时,我停止了如何更改默认CSS类的操作,该类将默认添加到InputText Validation State.
I'm Trying Microsoft Blazor and when working with forms and validation I stopped on how can I change the default CSS class that will be added by default on InputText Validation State.
有关InputText默认情况下有错误的解释,请使用类"invalid",我想将此类更改为"is-invalid"
For Explanation when InputText has an error by default take class "invalid" I want to change this class to "is-invalid"
我需要最佳实践
感谢StackOverflow社区
Thanks, StackOverflow community
推荐答案
Blazor任意选择invalid
作为css类,用于基于InputBase<T>
的项目验证,例如InputText
.但是,您可以创建一个像MyInputText.razor
这样的新控件,并从中继承它们,并制作自己的控件并将中介代码放置在适当的位置.
Blazor has arbitrarily picked invalid
as the css class for InputBase<T>
based items' validation, like InputText
. You can however create a new control like MyInputText.razor
inherit from these and make your own control and put intermediary code in place.
在这种情况下,您可以将CssClass
属性替换为is-invalid
和/或valid for
有效的CssClass
属性进行字符串替换(但要带空格字符!).您可以制作一个辅助方法,也可以直接内联:
In this case you can string replace (but prepend with space character!) the CssClass
property replacing invalid
for is-invalid
, and/or valid for
is-valid`. You could make a helper method or simply do it inline:
@inherits Microsoft.AspNetCore.Components.Forms.InputText
<input @attributes="@AdditionalAttributes" class="@CssClass.Replace(" valid", " is-valid").Replace(" invalid", " is-invalid")" @bind="@CurrentValueAsString" />
并像正常使用InputText
一样使用它:
and use it as you would a normal InputText
:
<MyInputText @bind-Value="yourModel.Foo" class="form-control" />
这篇关于Blazor更改验证的默认CSS类名称的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!