asp.net - 如何在 ASP.NET CORE Razor Pages 中创建共享表单？

Question

我必须在页眉中创建一个可重用的表单。它应该显示在每个页面上。简单的输入和提交按钮将发送 POST 请求。

我所知道的选项是部分 View 或 View 组件。我检查了有关 View 组件的文档，但没有提到它适用于表单。只有 InvokeAsync 方法可用于初始化 View 。

使用分部 View ，可能很难定义其页面模型，并且我不知道将其 POST 处理程序放在哪里。

我看到的另一个选项是，以某种方式将表单直接放置在 _Layout.cshtml 上，但是，它没有页面模型(据我所知)，

那么创建共享表单的方法是什么？应该在哪里处理 POST 请求？

Answer 1

您应该使用 View 组件，因为这允许您拥有某种程度独立的模型和 View 交互。

public class SharedFormViewComponent : ViewComponent
{
    public Task<IViewComponentResult> InvokeAsync() =>
        Task.FromResult(View(new SharedFormViewModel()));
}

然后，将表单 HTML 代码放入 Views\Shared\Components\SharedForm\Default.cshtml 中。对于表单的操作，您需要指定一条路线。稍后会详细介绍。然后，显示您的表单:

@await Component.InvokeAsync("SharedForm")

现在，正如您所了解的那样， View 组件无法发布到。这不是“不支持表格”的问题；而是“不支持表格”的问题。它们实际上不是请求管道的一部分，因此无法响应 POST 等请求。您需要一个独特的操作来处理某些 Controller 上的 POST。在组件的表单标记上，然后:

<form asp-action="SharedFormHandlerAction" asp-controller="Foo" asp-area="" method="post">

应提供 asp-area 属性，以防在不同区域的上下文中使用该属性。

您还需要一个“返回 URL”。这将是当前页面的 URL，以便用户成功发布表单后，他们将返回到提交表单的页面。您可以通过向表单添加隐藏输入来实现这一点:

<input type="hidden" name="returnUrl" value="@(Context.Request.Query["returnUrl"].FirstOrDefault() ?? (Context.Request.Path + Context.Request.QueryString))" />

然后，您的处理程序操作应该采用类似 string returnUrl = null 的参数，成功后您应该执行以下操作:

return !string.IsNullOrEmpty(returnUrl) && Url.IsLocalUrl(returnUrl)
    ? Redirect(returnUrl)
    : RedirectToAction("SomeDefaultAction");

事情变得有点棘手的是处理验证错误。由于您要发布到不同的操作，因此您无法返回用户所在的上一个 View 以显示布局或其他内容中的验证错误。相反，您需要一个特定于该处理程序操作的 View ，该 View 只是您的共享表单。您可以在此处将 View 用作 View 组件的部分 View :

<partial name="~\Views\Shared\Components\SharedForm\Default.cshtml" />