feat(module: menu): Add IconTemplate for menu item (#1879)

components/menu/MenuItem.razor

@@ -5,7 +5,12 @@
     <Tooltip Title="@content(this)" Placement="@PlacementType.Right" Disabled="TooltipDisabled">
         <Unbound>
             <li class="@ClassMapper.Class" role="menuitem" style=" @(PaddingLeft>0? $"padding-left:{PaddingLeft}px;":"") @Style" @onclick="HandleOnClick" @key="Key" @ref="context.Current">
-                @if (Icon != null)
+
+                @if (IconTemplate != null)
+                {
+                    @IconTemplate
+                }
+                else if (Icon != null)
                 {
                     <Icon Type="@Icon" />
                 }

components/menu/MenuItem.razor.cs

@@ -43,6 +43,9 @@ namespace AntDesign
         [Parameter]
         public string Icon { get; set; }
 
+        [Parameter]
+        public RenderFragment IconTemplate { get; set; }
+
         internal bool IsSelected { get; private set; }
         internal bool FirstRun { get; set; } = true;
         private string _key;

site/AntDesign.Docs/Demos/Components/Menu/demo/InlineCollapsed.razor

@@ -1,4 +1,6 @@
-<div style="width: 256px;">
+@inject IconService iconService
+
+<div style="width: 256px;">
     <Button Type="primary" OnClick="ToggleCollapsed" Style="margin-bottom: 16px">
         @if (collapsed)
         {
@@ -15,7 +17,12 @@
           Theme=MenuTheme.Dark
           InlineCollapsed=collapsed>
         <MenuItem Key="1" Icon="pie-chart">
-            Option 1
+            <IconTemplate>
+                <IconFont Type="icon-c-sharp-l" />
+            </IconTemplate>
+            <ChildContent>
+                Option 1
+            </ChildContent>
         </MenuItem>
         <MenuItem Key="2" Icon="desktop">
             Option 2
@@ -55,8 +62,13 @@
         <span>Navigation Two</span>
     </span>;
 
-        void ToggleCollapsed()
-        {
-            collapsed = !collapsed;
-        }
+    void ToggleCollapsed()
+    {
+        collapsed = !collapsed;
     }
+
+    protected async override Task OnInitializedAsync()
+    {
+        await iconService.CreateFromIconfontCN("//at.alicdn.com/t/font_2735473_hi62ezq5579.js");
+    }
+}

site/AntDesign.Docs/Demos/Components/Menu/doc/index.en-US.md

@@ -63,6 +63,7 @@ More layouts with navigation: [Layout](/components/layout).
 | Style    | Additional CSS style  | string |     -          |         |
 | Title | Title of the menu item | string |  |  |
 | Icon | The icon of the menu item | string | - | |
+| IconTemplate | Custom icon template, when `Icon` and `IconTemplate` are set at the same time, `IconTemplate` is preferred| RenderFragment | - | |
 
 ### SubMenu
 

site/AntDesign.Docs/Demos/Components/Menu/doc/index.zh-CN.md

@@ -66,6 +66,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/3XZcjGpvK/Menu.svg
 | Style    | 额外的 CSS 样式  | string |     -          |         |
 | Title    | 设置收缩时展示的悬浮标题 | string  |        |      |
 | Icon | 图标的类型| string | - | |
+| IconTemplate | 自定义Icon模板，当`Icon`和`IconTemplate`同时设置时，优先使用`IconTemplate`| RenderFragment | - | |
 
 ### SubMenu