Blazor框架中使用Async异步操作时绑定表单模型无法清空如何解决

AI 小北

2026-10-19

问题原因

你当前的代码存在两个核心错误导致模型重置不生效：

Save方法为同步方法，使用Task.Run包装异步确认逻辑后没有等待执行完成，myMod = new StudentModel()的执行时机和确认流程完全脱节，且在非UI线程修改组件状态时Blazor不会自动触发UI重渲染
模型重置逻辑放在了确认逻辑之外，无论用户点击确认还是取消都会直接执行重置，逻辑本身也不符合业务需求

修复方案

将Save方法改为异步，等待确认逻辑执行完成后再重置模型，手动触发组件渲染即可，修改后的代码如下：

@code {
    private StudentModel myMod= new StudentModel();
    // 修改为异步方法，无需用Task.Run包装异步逻辑
    private async Task Save()
    {
        bool askUser = ValidateEntry();

        if (askUser)
        {
            // 等待用户确认操作完成
            await ConfirmSave();
        }
        else
        {
            await CreateFile();
        }
        // 保存流程走完后统一重置模型
        myMod = new StudentModel();
        // 手动触发组件重渲染，刷新表单绑定字段
        StateHasChanged();
    }

    async Task ConfirmSave()
    {
        bool confirmed = await JsRuntime.InvokeAsync<bool>("confirm", $"Are you sure?");
        if (confirmed)
        {
            await CreateFile();
        }
    }
}