时间戳

首页 > 解决方案 > 将类添加到 Blazor(Razor) 验证

c# - 将类添加到 Blazor(Razor) 验证

问题描述

我知道 Blazor 开发轨道还处于早期阶段，但我想知道是否有人遇到过将类应用于 Blazor (Razor) 验证消息的方法？这是代码示例。

        <EditForm Model="@Employee" OnValidSubmit="@HandleValidSubmit">
        <DataAnnotationsValidator />
        <ValidationSummary />
        <div class="form-group row">
            <label for="lastName" class="col-sm-3">Last Name: </label>
            <div class="col-sm-8">
                <InputText id="lastName" @bind-Value="@Employee.LastName" class="form-control" placeholder="Enter last name" />
                <ValidationMessage For="@(() => Employee.LastName)" />
            </div>
        </div>

我希望能够在验证消息中添加text-danger,或其他类。col-sm-8我已经知道我可以使用默认validation-error类使用 CSS 来做到这一点。

标签： c#.netasp.net-corerazorblazor

解决方案

如上所述，您可以对ValidationMessage组件类进行子类化...我会给您一个更简单的解决方案，因为我不希望我的项目中有无数的类只是为了稍微改变外观。

ValidatorMessage只需用 a包装div并对其应用类：

<div class="col-sm-8 text-danger">
    <ValidationMessage For="@(() => Employee.LastName)" />
</div>

无论如何，组件所做的（通过代码）是使用类“ ”ValidationMessage呈现一个简单的，因此，如果您有任何未应用样式的问题，请考虑您可以使用正确的 CSS 选择器（可能还有一些标签）强制样式...）。divvalidation-message!important

推荐阅读