【问题标题】:Blazor MudSelect @bind-SelectedValues to both id and valueBlazor MudSelect @bind-SelectedValues 到 id 和 value
【发布时间】:2021-02-25 16:38:10
【问题描述】:

我需要知道所选项目的 ID 和价值。如以下示例。所以选项应该有一个选定部分的数组。

<MudGrid>
    <MudItem xs="6" sm="6" md="4">
        @*  <MudSelect T="string" Label="Parts" Strict="true" MultiSelection="true" Variant="Variant.Outlined" @bind-Value="value" @bind-SelectedValues="options" Margin="Margin.Dense" Required="true" Format="F2">*@
        <MudSelect T="string" Label="Parts " HelperText="Pick the Parts" MultiSelection="true" @bind-SelectedValues="options">
            @foreach (var part in parts)
            {
                <MudSelectItem T="string" Value=@part.PartValue>@part.PartValue</MudSelectItem>

            }
        </MudSelect>
    </MudItem>
</MudGrid>

@code {

    IEnumerable<Parts> parts = new List<Parts>()
    {
        new Parts() {PartID = 1, PartValue = "Audi"},
        new Parts() {PartID = 2, PartValue = "BMW"},
        new Parts() {PartID = 3, PartValue = "Chevrolet"},
        new Parts() {PartID = 4, PartValue = "Ferrari"},
        new Parts() {PartID = 5, PartValue = "Porsche"},
        new Parts() {PartID = 6, PartValue = "Renault"}
    };
    private int value { get; set; } = 0;
    private HashSet<int> options { get; set; } = new HashSet<int>() { 0 };

    public class Parts
    {
        public int PartID { get; set; }
        public string PartValue { get; set; }
    }
} 

【问题讨论】:

  • 不回答你的问题,但你能绑定项目列表而不是用循环构造吗?另外,您在哪里找到了如何绑定 Value 等?

标签: c# blazor blazor-webassembly


【解决方案1】:

在这里,您可以只在 MudSelect 中使用您的部件,但您必须在 Parts 中提供合适的覆盖以允许相等比较。这是您的 sn-p 更改。你可以在线玩:https://try.mudblazor.com/snippet/wEwFFQPUdcDWgbYs

代码:

<MudGrid>
    <MudItem xs="12">
        <MudSelect Label="Parts " HelperText="Pick the Parts" MultiSelection="true" @bind-SelectedValues="options">
            @foreach (var part in parts)
            {
                <MudSelectItem Value="@part">@part.PartValue</MudSelectItem>
            }
        </MudSelect>
    </MudItem>
    <MudItem xs="12">
        <br/><br/>
        Selected parts: @string.Join(", ", options.Select(x=>x.PartValue));
    </MudItem>
</MudGrid>

@code {

    IEnumerable<Parts> parts = new List<Parts>()
    {
        new Parts() {PartID = 1, PartValue = "Audi"},
        new Parts() {PartID = 2, PartValue = "BMW"},
        new Parts() {PartID = 3, PartValue = "Chevrolet"},
        new Parts() {PartID = 4, PartValue = "Ferrari"},
        new Parts() {PartID = 5, PartValue = "Porsche"},
        new Parts() {PartID = 6, PartValue = "Renault"}
    };
    private IEnumerable<Parts> options { get; set; } = new HashSet<Parts>() { 
        new Parts() {PartID = 2, PartValue = "BMW"},
        new Parts() {PartID = 4, PartValue = "Ferrari"},
    };

    public class Parts
    {
        public int PartID { get; set; }
        public string PartValue { get; set; }
        public override bool Equals(object o) {
            var other = o as Parts;
            return other?.PartID==PartID;
        }
        public override int GetHashCode() => PartID.GetHashCode();        
        public override string ToString() {
            return PartValue;
        }
    }
} 

【讨论】:

    猜你喜欢
    • 2020-08-10
    • 1970-01-01
    • 1970-01-01
    • 2023-03-04
    • 2021-10-08
    • 2016-10-26
    • 2021-11-11
    • 2021-06-27
    • 1970-01-01
    相关资源
    最近更新 更多