删除函数从 DB 中删除 table 值，但不从 HTML Table 中删除 BLAZOR

Question

我在显示公司列表的 blazor 应用程序中有这个 html table。现在，当我想删除特定行时，我单击删除图标。我注意到删除函数正在从数据库中删除行值，而不是从视图中删除。请检查我的代码，如果我遗漏了什么请告诉我。

代码：

            <table>
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>Company Name</th>
                        <th>Delete</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach (var Result in lstCompanies)
                    {
                    <tr>
                        <td>@Result.id</td>
                        <td>@Result.companyName</td>
                        <td>
                            <button @onclick="() => RemoveCompanyFromList(Result)">
                                <i class="fa fa-trash-o fa-lg"></i>
                            </button>
                        </td>
                    </tr>
                    }
                </tbody>
            </table>

onclick 移除函数代码：

   [Parameter]
    public EventCallback<List<Models.UTP>> ItemUpdated { get; set; }
        private void RemoveCompanyFromList(Models.UTP utpResult)
        {
            string utpidResult = utpResult.utpid;
            try
            {
                Http.PutAsJsonAsync($"api/Users/company/remove/{utpidResult}", utpidResult);
                ItemUpdated.InvokeAsync(lstCompanies);
                StateHasChanged();
            }
            catch (Exception ex)
            {
                string exMsg = ex.Message;
            }
        }

Answer 1

只需确保该项目已从 lstCompanies 中删除。

// make it async
private async Task RemoveCompanyFromList(Models.UTP utpResult)
{ 
    await Http.PutAsJsonAsync(
           $"api/Users/company/remove/{utpidResult}", 
           utpidResult);
    lstCompanies.Remove(utpidResult);     // add this
    ItemUpdated.InvokeAsync(lstCompanies);
    StateHasChanged();
}

或者，从后备存储（数据库）重新获取列表。

删除函数从 DB 中删除 table 值，但不从 HTML Table 中删除 BLAZOR

Remove function removes table value from DB but not from HTML Table In BLAZOR

html

c#

blazor

blazor-webassembly