时间戳

首页 > 解决方案 > .NET Core - 通过 Wrapper 异步加载视图组件（客户端）

javascript - .NET Core - 通过 Wrapper 异步加载视图组件（客户端）

问题描述

为了优化我们的 Web 应用程序的响应时间，我想从客户端异步加载 .NET Core 2.2 中的视图组件，而无需 Javascript。当然，您可以通过使用 AJAX 调用加载它们然后从控制器渲染视图来实现这一点。

但我想保留智能感知并在代码中使用标签，因此您可以在不同的地方多次调用带有这样标签的视图组件，而无需在 JS 中创建多个 ajax 帖子：

<vc:free-text ftx-code="STARTPAGE" obj-ref="null" custom-para="null"></vc:free-text>

我试图通过 TagHelper 加载视图组件，但显然它们也是同步渲染的（仅服务器端异步）：

    [HtmlTargetElement("widget", Attributes = WidgetNameAttributeName)]
    public class WidgetTagHelper : TagHelper
    {
        private readonly IViewComponentHelper _viewComponentHelper;
        public WidgetTagHelper(IViewComponentHelper viewComponentHelper)
        {
            _viewComponentHelper = viewComponentHelper;
        }

.....
        public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output)
        {
            ((IViewContextAware)_viewComponentHelper).Contextualize(ViewContext);
            var content = await _viewComponentHelper.InvokeAsync(typeof(FreeTextViewComponent), new { ftxCode = FTXCode, objRef = OBJRef, customPara = CustomPara });
            output.Content.SetHtmlContent(content);
        }
    }

有谁知道一种方法（包装器、TagHelper 等？），我首先使用“空”模式加载 ViewComponent，当它被渲染时，它会进行客户端异步回调以获取实际数据，如本文所述？ https://github.com/aspnet/AspNetCore.Docs/issues/7914#issuecomment-441280663

标签： javascriptajaxasp.net-core.net-core

解决方案

视图组件和标签助手不能直接访问。它们不是请求管道的一部分，也不响应任何内容。您可以做的最好的事情是创建一个恰好使用组件或标签助手的视图，然后从一个操作中返回该视图，这就是您实际向其发出请求的内容。

一般来说，对于这类东西，最好使用 Vue、Angular 等客户端库，并通过这些库创建客户端组件。然后，您的服务器充当 API，返回您提供给这些组件的 JSON 数据。

推荐阅读