c# - .NET Core - 为什么我应该使用 View 组件而不是集成在 MVC 应用程序或 Razor 页面中的 Blazor 组件

Question

在我们的新项目中，我们在现有的 MVC 应用程序中使用 View Compoments 来分离和重用组件。最近，Blazor 向前迈出了重要的一步。我们认识到使用 Blazor Components 来处理类似的异步任务要方便得多。例如将商品添加到购物车:

查看组件(旧方法):

在 View 组件中，我们需要创建一个 AJAX - POST 来添加一个位置，然后通过 AJAX - GET 请求重新加载购物车 View 组件。

Razor 组件(新方法)

官方文档:https://learn.microsoft.com/en-us/aspnet/core/blazor/integrate-components?view=aspnetcore-3.1

在 Razor 组件中，我们只需调用底层的 @code - 方法来添加位置，并可以调用重新呈现购物车 View 组件的事件。所以我们完全可以不用 JavaScript。下面是我的 MVC 应用程序中的一个工作示例:

ProductList.razor

<div>
@foreach (var c in products)
{
    <div class="row">

        <div class="col-md-3">
            <img src="@c.ImageURL" class="img-fluid p-3" alt="@c.Description ">
        </div>
        <div class="col-md-9">
            <div class="row">
                <div class="col-12 d-flex">
                    <span class="font-weight-bold mr-auto">@c.Title</span>
                    <span class="ml-auto">@c.Number</span>
                </div>
            </div>
            <button class="btnAddToCart" @onclick="(() => addposition(c.ID))"><i class="fas fa-shopping-cart"></i></button>
        </div>
    </div>
}

ProductList.razor.cs

分离了代码，但与我将它放在我的 razor 组件(继承 vom ComponentBase)上的“@Code()”中时的工作方式相同

public partial class ProductList : ComponentBase
{
    [Inject] Business.Cart cart { get; set; }
    [Inject] Business.Product product { get; set; }

    protected List<ListProduct> products = new List<ListProduct>();

    protected override async Task OnInitializedAsync()
    {
        List<ListProduct> temp = await product.GetProductList(new GetProductListRequest { CategoryURL = UrlDesc });
        products = temp;
    }

    protected async Task addposition(int artid)
    {
        CartAddPositionResponse resp = await cart.AddPosition(new CartAddPositionRequest { ProductID = artid });
        cart.CallRequestRefresh();
    }
}

Catalog.cshtml(MVC View )

<component type="typeof(ProductList)" render-mode="ServerPrerendered" param-urlDesc="@Model.urlDesc"/>

这导致了以下问题:

如果我只能使用 Blazor 组件，是否有任何理由使用 View 组件，它提供了直接调用异步方法的优势，并且可以在项目的任何地方多次重用？有没有缺点？

Answer 1

View 组件的一个主要功能是它呈现一个 block 而不是整个响应。这可用于渲染 View 和数据，例如跨所有 View 的登录/注销面板、导航栏、数据的最新更新等。 View 组件也允许您对它们运行异步操作。