大佬教程收集整理的这篇文章主要介绍了为什么 Blazor 的 EditForm 需要在提交按钮上单击两次才能执行任何操作？，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
我创建了一个新的、干净的 Blazor WASM 项目，并在索引页面底部添加了以下最小示例：
<EditForm Model="FormModel" Onsubmit="Onsubmit">
<inputText @bind-Value="FormModel" />
<button type="submit">submit</button>
</EditForm>
@code {
public string FormModel { get; set; } = "";
public async Task Onsubmit(EditContext context) => Console.Writeline("Clicked");
}
当我聚焦文本框时，写一些东西然后点击提交按钮什么也没有发生。只有在第二次单击时，消息才会出现在控制台中。
这看起来像一个 blazor 错误，但有很多关于这个问题的票，结果总是发现实际上是用户代码中的错误。但是，我发现的所有解决方案或原因都不适用于这种最小情况。
有什么我遗漏的吗？我会 - 显然 - 喜欢按钮不要忽略第一次点击。
我找到了解决该问题的方法，用另一个对象包装模型似乎可以解决问题：
<EditForm Model="Model" OnSubmit="OnSubmit">
<InputText @bind-Value="Model.Value" />
<button type="submit">
<div>Submit</div>
</button>
</EditForm>
@code {
public class FormModel {
public string Value { get; set; }
}
public FormModel Model { get; set; } = new FormModel();
public async Task OnSubmit(EditContext context) => Console.WriteLine("Clicked");
}
这个问题总是被证明是用户代码中的错误
没错...
您在这里所做的一方面是将您的 EditForm（模型属性）绑定到一个字符串属性，并将 InputText 组件绑定到完全相同的属性。 Model 参数应该是对象类型，而 InputText 组件的 Value 属性是字符串，它最初包含值 null，您可能已经注意到，因为编译器期望提供 EditForm 的 Model 参数或 EditForm 的 EditContext 参数，而不是无效的。因此，您无辜地为 FormModel 属性分配了一个空字符串值，从而安抚了编译器，但您的代码仍然格式错误，并且需要为此付出代价...
每当您单击“提交”按钮时，都会调用 OnSubmit 事件处理程序，您需要自己处理提交，而您不这样做。由于“提交”按钮嵌入在表单中，一旦您单击按钮，就会执行提交操作，并将表单发布到外层空间……执行流程不再在 Blazor SPA 中。表单数据提交到外太空返回后，第二次提交调用Console.WriteLine("Clicked");
注意，如果使用 OnValidSumit 事件，Blazor JSInterop 会拦截提交操作并取消它。 Blazor 中不存在表单提交的概念。所有 Blazor 应用程序都发生在一个糟糕的页面上；这是SPA空间。同样，如果您使用 OnSubmit 事件处理程序，则必须在前往外太空之前拦截提交操作并自行取消。
以上是大佬教程为你收集整理的为什么 Blazor 的 EditForm 需要在提交按钮上单击两次才能执行任何操作？全部内容，希望文章能够帮你解决为什么 Blazor 的 EditForm 需要在提交按钮上单击两次才能执行任何操作？所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。