自定义 Blazor 选择选项 - 不从绑定值中选择初始项目答案

【问题标题】：Custom Blazor Select Option - not selecting initial item from bound value自定义 Blazor 选择选项 - 不从绑定值中选择初始项目
【发布时间】：2020-05-01 15:04:37
【问题描述】：

在创建自定义组件时，我想使用自定义 Option 组件扩展 Select，这样我就可以添加额外的参数等。

这个的简化版本：

<option value="@value">@ChildContent</option>   

@code {
    [Parameter] public RenderFragment ChildContent { get; set; }
    [Parameter] public string value { get; set; }
 }

我以与选项标签完全相同的方式使用组件，并且在 html 方面，代码呈现完全相同。

看起来一切正常，但没有进行初始绑定，例如。始终选择顶部选项，但仅可见 - 值是空字符串。

【问题讨论】：

像这样使用@key
@AliBorjian 不幸的是，这不起作用。仍然未定义，显示最佳选项

标签： html-select blazor custom-component

【解决方案1】：

您只需要创建自定义剃须刀组件 -> 包含此类内容的 CustomOption.razor

    <option value="@value" class="@specAttribute">@ChildContent</option>

@code {
    [Parameter] public RenderFragment ChildContent { get; set; }
    [Parameter] public string value { get; set; }
    [Parameter] public string specAttribute { get; set; }
}

然后使用它：

<InputSelect  @bind-Value="@language">
    <CustomOption value="English" specAttribute="list-item">English</CustomOption>
    <CustomOption value="Spanish" specAttribute="list-item">Spanish</CustomOption>
</InputSelect>

【讨论】：

这与我的原始帖子中的代码相同。问题不是自定义选项标签，而是它没有绑定初始值。如果您创建了两次选择（一次使用选项，一次使用自定义选项）并将语言设置为“西班牙语”，标准选择将是正确的，但自定义选择会说英语（它甚至没有设置为英语，它只是顶部列表）

【解决方案2】：

经过进一步调查，这已被确定为一个错误。

GitHub dotnet/aspnetcore 上两个问题的链接：

elements inserted dynamically during same diff as don't get auto-selected #21453

Blazor: Dynamic not setting selected value #21432

【讨论】：