Blazor Server添加记录后表单仍存旧数据，如何重新渲染/加载？

核心解决方案：重置绑定的Model实例 #

在AddPost方法完成数据库插入操作后，不要直接清空现有Post对象的属性，而是重新创建一个新的Post实例。这是因为Blazor的组件渲染依赖对象引用变化，直接修改属性有时无法触发组件的自动重新渲染，替换实例能确保组件检测到Model更新，从而清空表单。

示例代码修改：

private async Task AddPost()
{
    // 执行数据库插入逻辑
    await _yourDbContext.Posts.AddAsync(Post);
    await _yourDbContext.SaveChangesAsync();

    // 重置表单：创建新的Post实例
    Post = new Post(); // 这里的Post是你的数据模型类
    Success = false; // 重置成功提示状态
}

如果上述操作后仍未生效，可以在重置实例后手动调用StateHasChanged()强制组件重新渲染：

Post = new Post();
Success = false;
StateHasChanged();

修正代码中的潜在问题 #

你的表单代码里存在两个需要修复的问题，可能也会影响表单行为：

• 多个InputText/InputTextArea的name属性重复设置为"title"，每个输入项的name应该唯一，比如分别设为"title"、"description"、"author"。
• InputSelect的默认选项value="0"，如果你的Post.Category是字符串类型，建议改为value=""，避免类型不匹配导致的绑定异常。

修正后的表单部分代码：

<p><InputText name="title" class="form-control" placeholder="Post title" @bind-Value="@Post.Title"></InputText></p>
<p><InputTextArea name="description" class="form-control" placeholder="Post description" @bind-Value="@Post.Description"></InputTextArea></p>
<p><InputText name="author" class="form-control" placeholder="Nick" @bind-Value="@Post.Author"></InputText></p>
<p>
    <InputSelect id="category" class="form-select" @bind-Value="@Post.Category">
        <option value="" selected="selected">Categories list</option>
        @foreach (var category in Categories!)
        {
            <option value="@category.Category">@category.Category</option>
        }
    </InputSelect>
</p>

为什么OnAfterRenderAsync没用？ #

OnAfterRenderAsync是组件渲染完成后的生命周期方法，它主要用于处理DOM操作，无法直接触发表单的重新绑定。解决表单数据残留的关键是修改绑定的Model，而不是在渲染后操作DOM。

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