asp.net core adminlte 后台 动态菜单 ViewComponent
View Component 负责渲染一小部分内容,而非全部响应,所有Partial View能解决的问题,你都可以使用View Component来解决,比如:动态导航菜单、Tag标签、登录窗口
1.mvc项目下建立 Componets目录,增加一个MenuViewComponent类
namespace Web.Components { [ViewComponent(Name = "Menus")] public class MenuViewComponent : ViewComponent { public MenuViewComponent() { } public IViewComponentResult Invoke() { var Id = HttpContext.Session.GetString("UserId"); var menus = _menuService.GetMenus(int.Parse(Id)); return View(menus); } } }
2.在views/shared文件夹下建立,Menus文件夹,增加default.cshtml
@using Microsoft.AspNetCore.Html @using System.Text; @model List<Service.Menu> @functions { public IHtmlContent GetMenus(List<Service.Menu> menus, int parentid) { StringBuilder sb = new StringBuilder(); MenuParent(sb, menus, parentid); return new HtmlString(sb.ToString()); } public void MenuParent(StringBuilder sb, List<Service.Menu> menus, int parentid) { List<Service.Menu> menuParent = menus.FindAll(t => t.ParentId == parentid); foreach (var node in menuParent) { sb.Append("<li class='treeview'>"); sb.Append("<a href='" + node.Url + "'>"); sb.Append("<i class='" + node.Icon + "'></i> <span>" + node.Name + "</span>"); sb.Append("<span class='pull-right-container'>"); sb.Append("<i class='fa fa-angle-left pull-right'></i>"); sb.Append("</span>"); sb.Append("</a>"); MenuSun(sb, menus, node.Id); sb.Append("</li>"); } } public void MenuSun(StringBuilder sb, List<Service.Menu> menus, int id) { List<Service.Menu> menuSun = menus.FindAll(t => t.ParentId == id); if (menuDtoSun.Count > 0) { sb.Append("<ul class='treeview-menu'>"); foreach (var node in menuSun) { if (menus.FindAll(t => t.ParentId == node.Id).Count > 0) { MenuParent(sb, menus, node.Id); } else { sb.Append("<li><a href=" + node.Url + "><i class='" + node.Icon + "'></i>" + node.Name + "</a></li>"); } } sb.Append("</ul>"); } else { return; } } } @GetMenus(Model, 0)
3.在需要使用的页面增加 @await Component.InvokeAsync("Menus");
这样就完成了菜单的调用,好处是不会出现乱码。如果不是adminlte后台可以直接返回json绑定到前台的树形插件就不用写@functions这样的方法了
感谢
孙老的博客
9.2.4 .net core 通过ViewComponent封装控件
让我顺利的解决的前台乱码的问题
另一种方法是@Html.Raw()
在default.cshtml下直接获得后台的信息
@model System.Text.StringBuilder
@Html.Raw(Model.ToString())
同样可以解决乱码的问题