如何将 Dictionary<string, dynamic> 传递给 blazor 组件？答案

【问题标题】：How can I pass Dictionary<string, dynamic> to a blazor component?如何将 Dictionary<string, dynamic> 传递给 blazor 组件？
【发布时间】：2021-11-16 09:05:21
【问题描述】：

我正在尝试将字典作为参数传递给 blazor 组件。字典需要存储, , 和> 键值对。

我尝试执行此操作，但收到错误消息，“'EventCallbackFactory' 没有名为 'CreateBinder' 的适用方法，但似乎具有该名称的扩展方法。扩展方法无法动态调度。”

我正在尝试做的事情是否有效，如果不是，为什么？我还有其他方法可以解决这个问题吗？

这是我的 blazor 组件的代码，供参考：

@page "/dictitemcomponent"
@using System.Collections.Generic;

<ul>
    @foreach (KeyValuePair<string, dynamic> item in thisDict)
    {
        
        @if(item.Value.GetType() == typeof(Dictionary<string, dynamic>))
        {
            <li>@item.Key.ToString() : </li>
            @foreach (var dict in item.Value)
            {
                <DictItemComponent thisDict=dict/>
            }
        }
        
        @if(item.Value.GetType() == typeof(List<dynamic>))
        {
            <li>@item.Key.ToString() : </li>
            @foreach (var value in item.Value)
            {
                <li>@value</li>
            }
        }
        
        @if(item.Value.GetType() != typeof(List<dynamic>) && item.Value.GetType() != typeof(Dictionary<dynamic, dynamic>))
        {
            <li>@item.Key.ToString() : <input @bind="item.Value"/></li>       
        }
    }
</ul>

@code
{
    public KeyValuePair<string, dynamic> newProperty = new KeyValuePair<string, dynamic>();
    [Parameter] public Dictionary<string,dynamic> thisDict {get; set;}= new Dictionary<string, dynamic>();

    //convert the value of a KVP to a dictionary
    public void ValueToProperty(KeyValuePair<string,dynamic> property)
    {
        string key = property.Key;
        property = new KeyValuePair<string, dynamic>(key, new Dictionary<string, dynamic>());
    }

    public void ValueToList(KeyValuePair<string,dynamic> property)
    {
        string key = property.Key;
        property = new KeyValuePair<string, dynamic>(key, new List<dynamic>());
    }
}

【问题讨论】：

标签： dynamic types casting blazor

【解决方案1】：

我可以知道你想要达到什么目标吗？
根据您的第一个 if 语句，为什么字典中有字典？通过阅读您的异常和您的第三个条件语句，您似乎正在尝试将输入绑定到您的字典值。但是，这不是您应该使用字典的方式。除非您绑定到通常的“类型”属性（例如字符串），否则您可以使用@bind=someVariable。否则，在字典中，每个值都应该与它们各自的键相关联，因此，@bind=_dict[key]（@bind-value 和@bind-value:event 的“速记”语法）而不是将输入绑定到item.value。为了更容易理解，我已经对上述条件语句进行了限定，并在以下几行中模拟了该问题的解决方案。它应该在onchange 期间在input 旁边的<label> 中呈现值：

@page "/dict"
@foreach (var kvp in _dict)
{
<div>
    <label>@kvp.Key</label>
    <input @bind=_dict[kvp.Key] />
    <label>Key:@kvp.Key|Value:@kvp.Value</label>
}
@code {
    private Dictionary<string, string> _dict = new()
    {
        ["1"] = "One",
        ["2"] = "Two",
        ["3"] = "Three",
        ["4"] = "Four",
        ["5"] = "Five",
    };
}

Meanwhile, you should simplify your if statements as follow:

@if(item.Value.GetType() == typeof(Dictionary<string, dynamic>))
{
    //dowork
}
else if(item.Value.GetType() == typeof(List<dynamic>))
{
    //do more work
}
else
{
    //do other work
}

[Screenshot for my Input fields rendered based on Key Value Pair and value entered][1]


  [1]: https://i.stack.imgur.com/iG6Mr.png

【讨论】：