Blazor项目中Syncfusion SfToast通知无法显示问题求助

1. 方法名称不匹配 #

你的EditForm绑定的OnValidSubmit="ShowNotification"，但后台代码里定义的方法是ShowOnClick，两者名称不一致，导致表单提交时无法触发显示Toast的逻辑。需要将后台方法名改为ShowNotification，或者修改EditForm的绑定方法名。

修改后的后台代码：

public async Task ShowNotification()
{
    await Task.Delay(100);
    await this.ToastObj?.ShowAsync();
}

2. 提交按钮未设置正确类型 #

你的Submit按钮没有指定type="submit"，Blazor中EditForm内的按钮默认类型是button，不会触发表单的提交事件。需要给按钮添加type="submit"属性：

<button type="submit">Submit</button>

3. 可选：确保表单验证逻辑正常（若依赖验证触发提交） #

如果你的OnValidSubmit依赖表单验证通过才触发，需要给Model类的属性添加验证特性，否则表单验证不通过时不会执行提交逻辑：

public class Model
{
    [Required]
    public string name { get; set; } = string.Empty;
}

同时在EditForm内添加验证组件：

<DataAnnotationsValidator />
<ValidationSummary />

如果不需要验证，可以改用OnSubmit替代OnValidSubmit，这样无论验证状态如何都会触发提交。

4. 空引用防护 #

在调用ShowAsync()时添加空值判断，避免ToastObj未初始化导致的异常，比如使用?.ShowAsync()。

修复后完整代码示例 #

form.razor

@using Syncfusion.Blazor;

<EditForm Model="model" OnValidSubmit="ShowNotification">
    <DataAnnotationsValidator />
    <ValidationSummary />
    <div class="mb-8">
        <label class="block text-sm font-medium leading-6 text-gray-900">Titulo</label>
        <SfTextBox @bind-Value="@model.name"></SfTextBox>
        <ValidationMessage For="@(() => model.name)" />
    </div>
    <button type="submit">Submit</button>
</EditForm>

<SfToast @ref="@ToastObj" Content="La informacion se ha enviado correctamente" Timeout="5000">
    <ToastPosition X="Right" Y="Top"></ToastPosition>
</SfToast>

form.razor.cs

public partial class Form
{
    private Model model = new();
    public SfToast? ToastObj;

    public async Task ShowNotification()
    {
        await Task.Delay(100);
        await this.ToastObj?.ShowAsync();
    }
}

public class Model
{
    [Required(ErrorMessage = "Titulo es requerido")]
    public string name { get; set; } = string.Empty;
}

内容的提问来源于stack exchange，提问作者Gegob