如何在mvc core 3.1的布局页面中添加部分视图？

Question

我想在我的电子商务网站中使用mvc core 3.1在布局页中显示一个动态菜单，我不知道如何在部分视图中添加控制器或有更好的方法在核心中呈现部分视图。

以下是我的代码

<partial name="_MegaMenu"/>

我的部分观点

@model IEnumerable<SmartEcom.Models.Nav>
    <ul>
        @foreach (var item in Model)
        {
            <li class="submenu">
                <a href="javascript:void(0);" class="show-submenu">@item.Title</a>
                <ul>
                    <li><a href="index.html">Slider</a></li>
                    <li><a href="index-2.html">Video Background</a></li>
                    <li><a href="index-3.html">Vertical Slider</a></li>
                    <li><a href="index-4.html">GDPR Cookie Bar</a></li>
                </ul>
            </li>
        }
</ul>

以下是我的控制器

 public IActionResult PartialViewMegaMenu()
        {
            var navigationlist = _unitOfWork.Nav.GetAll();
            return PartialView("_MegaMenu",navigationlist);
        }

Answer 1

你需要一个视图组件，这里，不是局部视图。

public class MegaMenuViewComponent : ViewComponent
{
    private readonly UnitOfWork _unitOfWork;

    public MegaMenuViewComponent(UnitOfWork unitOfWork)
    {
        _unitOfWork = unitOfWork; 
    }

    public IViewComponentResult Invoke()
    {
        var navigationlist = _unitOfWork.Nav.GetAll();
        return View(navigationlist);
    }
}

然后，把你的局部的HTML放到一个视图中，在 ~/Views/Shared/Components/MegaMenu/Default.cshtml. 最后，在你的布局中，在你希望菜单出现的地方添加以下内容。

@await Component.InvokeAsync("MegaMenu")

参见 视图组件的文件 更多信息。