【发布时间】:2021-01-22 06:47:01
【问题描述】:
我正在尝试为从 inputbase 派生的 Blazor 上的编辑表单创建定制输入,但是我正在努力掌握它,因为我这周最近才开始使用 Blazor,而一般来说,本月才开始使用 C#。
我找到了 https://www.meziantou.net/creating-a-inputselect-component-for-enumerations-in-blazor.htm(或找到下面粘贴的代码) 并能够将它用于 inputselect 内的可为空枚举,但是尝试将其复制为可为空的输入复选框无济于事。我想知道是否有人有链接或知道如何调整它以使其正常工作。
提前谢谢你,我几乎整天都在我的电脑上,所以请随时提问,尽量不要责备我哈哈。
// file: Shared/InputSelectEnum.cs
using System;
using System.ComponentModel.DataAnnotations;
using System.Globalization;
using System.Reflection;
using Humanizer;
using Microsoft.AspNetCore.Components;
using Microsoft.AspNetCore.Components.Forms;
using Microsoft.AspNetCore.Components.Rendering;
// Inherit from InputBase so the hard work is already implemented ????
// Note that adding a constraint on TEnum (where T : Enum) doesn't work when used in the view, Razor raises an error at build time. Also, this would prevent using nullable types...
namespace OrderServiceFrontEnd.Shared
{
public sealed class InputSelectEnum<TEnum> : InputBase<TEnum>
{
// Generate html when the component is rendered.
protected override void BuildRenderTree(RenderTreeBuilder builder)
{
builder.OpenElement(0, "select");
builder.AddMultipleAttributes(1, AdditionalAttributes);
builder.AddAttribute(2, "class", CssClass);
builder.AddAttribute(3, "value", BindConverter.FormatValue(CurrentValueAsString));
builder.AddAttribute(4, "onchange", EventCallback.Factory.CreateBinder<string>(this, value => CurrentValueAsString = value, CurrentValueAsString, null));
// Add an option element per enum value
var enumType = GetEnumType();
foreach (TEnum value in Enum.GetValues(enumType))
{
builder.OpenElement(5, "option");
builder.AddAttribute(6, "value", value.ToString());
builder.AddContent(7, GetDisplayName(value));
builder.CloseElement();
}
builder.CloseElement(); // close the select element
}
protected override bool TryParseValueFromString(string value, out TEnum result, out string validationErrorMessage)
{
// Let's Blazor convert the value for us ????
if (BindConverter.TryConvertTo(value, CultureInfo.CurrentCulture, out TEnum parsedValue))
{
result = parsedValue;
validationErrorMessage = null;
return true;
}
// Map null/empty value to null if the bound object is nullable
if (string.IsNullOrEmpty(value))
{
var nullableType = Nullable.GetUnderlyingType(typeof(TEnum));
if (nullableType != null)
{
result = default;
validationErrorMessage = null;
return true;
}
}
// The value is invalid => set the error message
result = default;
validationErrorMessage = $"The {FieldIdentifier.FieldName} field is not valid.";
return false;
}
// Get the display text for an enum value:
// - Use the DisplayAttribute if set on the enum member, so this support localization
// - Fallback on Humanizer to decamelize the enum member name
private string GetDisplayName(TEnum value)
{
// Read the Display attribute name
var member = value.GetType().GetMember(value.ToString())[0];
var displayAttribute = member.GetCustomAttribute<DisplayAttribute>();
if (displayAttribute != null)
return displayAttribute.GetName();
// Require the NuGet package Humanizer.Core
// <PackageReference Include = "Humanizer.Core" Version = "2.8.26" />
return value.ToString().Humanize();
}
// Get the actual enum type. It unwrap Nullable<T> if needed
// MyEnum => MyEnum
// MyEnum? => MyEnum
private Type GetEnumType()
{
var nullableType = Nullable.GetUnderlyingType(typeof(TEnum));
if (nullableType != null)
return nullableType;
return typeof(TEnum);
}
}
}
Blazor 组合:
<InputSelectEnum @bind-Value="@_Order.IOSAppDetails.PhasedRelease"/>
【问题讨论】:
-
发布 another 控件的代码并没有帮助。你在哪里卡住复选框,你期望什么? HTML 不支持 Iirc 三态。
-
InputCheckbox有什么问题(或遗漏)? -
问题在于将可空布尔值绑定到
,我发送的链接是为 绑定可空枚举的解决方法 -
我遇到的问题是我无法将可为空的属性绑定到 Blazor 中的默认 InputCheckbox。我在尝试将可为空的枚举绑定到选择时遇到了这个问题,但是我能够根据我的原始帖子在线找到解决方案。我希望能够为 InputCheckbox 完成同样的事情,这样我就可以将一个可为空的 bool 绑定到它,但是我在网上找不到任何这样的例子,而且我是 Blazor 的新手,我不确定如何继续。
-
为了提供一些额外的上下文,我试图在数据源中创建一个简单的 CRUD 样式接口,但是 API 可以为 JSON 响应中的许多键返回空值。我目前将该 JSON 映射到由可为空类型属性组成的模型,然后希望将这些属性绑定到 UI 以进行操作。如果我完全以错误的方式处理这个问题,请随时纠正我。
标签: c# html-parsing blazor nullable blazor-editform