如何在 ASP.NET Core 的不同位置使用 View Component 的视图？

问题描述

我在我的项目中使用视图组件。有时，我需要使用与各种样式相同的视图组件。我研究了很多，但没有找到解决方案。

下面的代码工作正常，但是当我这样做时，我无法按照我想要的方式使用它。

查看组件类：

    public IViewComponentResult Invoke(BlogSidebarviewmodel vm)
    {
        vm.BlogTags = _uow.BlogTag.GetAllByPriority(true,vm.LangId,vm.WebsiteId);
        vm.BlogCategories = _uow.BlogCategory.GetAllByPriority(true,vm.WebsiteId).Include(p=>p.BlogTag);
        vm.RecentBlogs = _uow.Blog.GetAllByEnabledDate(true,vm.WebsiteId);
        //return View(vm); //For Default Blog Sidebar View Component
        //return View("RedComponent",vm); //For Red Blog Sidebar View Component
        //return View("GreenComponent",vm);//For Green Blog Sidebar View Component
    }

但是，当我编写以下代码时，出现错误。

@await Component.InvokeAsync("BlogSidebar/RedComponent"); 

或

@await Component.InvokeAsync("~/Views/Shared/Components/BlogSidebar/GreenComponent.cshtml");

我想在各种视图中使用视图组件。我能怎么做？我可以吗？

编辑

我可以同时使用视图组件的视图吗？例如，当我在“Blogs/ABC.cshtml”视图中使用“GreenComponent”时，我想在“Blogs/XYZ.cshtml”视图中使用“RedComponent”视图。

解决方法

请按照以下步骤使用视图组件：

1.在文件夹GreenComponent.cshtml中创建Views/Shared/Components/BlogSidebar。

2.创建名为 BlogSidebar 的视图组件：

public class BlogSidebar : ViewComponent
{
    public IViewComponentResult Invoke(BlogSidebarViewModel vm)
    {
        vm.Id = 1;
        vm.Name = "aaa";
        return View("GreenComponent",vm);
    }
}

3.GreenComponent.cshtml：

@model BlogSidebarViewModel
Name: @Model.Name

4.Index.cshtml：

@model BlogSidebarViewModel

@await Component.InvokeAsync("BlogSidebar",new BlogSidebarViewModel())

结果：