如何将Icon指定为字符串

Question

我使用的是作为svg字符串实现的图标列表的MudBlazor。

这个很好，例如:

<MudNavLink Href="fetchdata" Match="NavLinkMatch.Prefix" Icon="@Icons.Material.Filled.Home">Fetch data</MudNavLink>

生成这个元素:

<div class="mud-nav-item mud-ripple"><!--!--><a href="" rel="" class="mud-nav-link active"><!--!--><svg class="mud-icon-root mud-icon-default mud-svg-icon mud-icon-size-medium mud-nav-link-icon mud-nav-link-icon-default" focusable="false" viewBox="0 0 24 24" aria-hidden="true"><!--!--><path d="M0 0h24v24H0z" fill="none"></path><path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"></path></svg><div class="mud-nav-link-text">Home</div></a></div>

但是现在我想对导航项列表进行数据驱动。所以我创建了一个模型，然后尝试遍历项目并动态创建列表。除了图标之外，这是有效的。图标未设置

@foreach (var menuItem in this._navMenuList)
{
<MudNavLink Href="@menuItem.Href" Icon="@(menuItem.Icon)">@menuItem.Text</MudNavLink>
}

结果如下:

<div class="mud-nav-item mud-ripple"><!--!--><a href="" rel="" class="mud-nav-link active"><!--!--><span class="mud-icon-root mud-icon-default mud-icon-size-medium mud-nav-link-icon mud-nav-link-icon-default Icons.Material.Filled.Home"></span><div class="mud-nav-link-text">Home</div></a></div>

如何使图标按预期显示?

Answer 1

我是这样让它工作的:

<MudNavLink Href="@menuItem.Href" Icon="@(typeof(Icons.Material.Filled).GetField(menuItem.IconName)?.GetValue(null) as string)" >@menuItem.Text</MudNavLink>