MudTable не является двухсторонней привязкой?

Я новичок в Blazor и MudBlazor, и у меня есть странная проблема, которую я не могу понять. Не уверен, что это будет иметь значение, но на всякий случай я использую Visual Studio 2022 17.1.3. У меня есть MudTable, который отображает список объектов. Я хочу выполнять базовые операции CRUD, но у меня возникают проблемы с удалением. Моя логика довольно проста: при нажатии на кнопку удаления появляется MudDialog для подтверждения удаления. Если вы нажмете кнопку «Удалить» в диалоговом окне, она вызовет мою функцию DeleteUser, передав идентификатор, чтобы я мог удалить, а затем имя, которое используется в сообщении подтверждения. Когда я прохожу процесс и отлаживаю, все выглядит так, как должно. Я получаю идентификатор и имя, я могу сказать, что была нажата кнопка «Удалить», я могу удалить из базы данных, я могу подтвердить, что количество записей в моем списке равно одному значению, а затем уменьшается на запись после того, как я удаляю ее из базы данных. список, но после этого диалоговое окно исчезнет, ​​а MudTable по-прежнему будет отображать исходные записи вместо отображения нового списка с удаленной записью. Суть в том, что если я снова нажму кнопку удаления, появится диалоговое окно (и вы все еще можете видеть таблицу на заднем плане), а затем первая удаленная запись исчезнет, ​​что уже должно было произойти. Как будто не работает двухсторонняя привязка. Что действительно бросает меня на это, так это то, что это работало изначально. Итак, может быть, я что-то сделал, чтобы он не работал, но я не вижу ничего, что выглядело бы неправильно.

Я ищу любые предложения. Я потратил несколько часов, пытаясь понять это, и не добился никакого прогресса.

<MudTable Items = "@applications" Filter = "new Func<AaApp, bool>(Search)" Hover = "true" Bordered = "true" Striped = "true" Dense = "true" >        
        <ToolBarContent>
            <a class = "btn btn-sm btn-success" @onclick = "(e => CreateAsync())" >
                <i class = "fas fa-plus"></i> New
            </a>
            <MudSpacer />
            <MudTextField @bind-Value = "searchString" Placeholder = "Search for an Application..." Adornment = "Adornment.Start" AdornmentIcon = "@Icons.Material.Filled.Search" IconSize = "Size.Medium" Class = "mt-0"></MudTextField>
        </ToolBarContent>
        <HeaderContent>
            <MudTh>ID</MudTh>
            <MudTh>
                <MudTableSortLabel InitialDirection = "SortDirection.Ascending" SortBy = "new Func<AaApp, object>(x=>x.Name)">Application Name</MudTableSortLabel>
            </MudTh>
            <MudTh>Description</MudTh>
            <MudTh></MudTh>
        </HeaderContent>
        <RowTemplate>
            <MudTd DataLabel = "ID">@context.Id</MudTd>
            <MudTd DataLabel = "Application Name">@context.Name</MudTd>
            <MudTd DataLabel = "Description">@context.Description</MudTd>
            <MudTd DataLabel = "">
                <MudButton OnClick = "@((e) => DeleteUser(@context.Id, @context.Name))" Variant = "Variant.Filled" Color = "Color.Error">Delete Records</MudButton>
            </MudTd>
        </RowTemplate>
        <PagerContent>
            <MudTablePager PageSizeOptions = "new int[] { 5,10,25,50}" />
        </PagerContent>
    </MudTable>

@code {

    private string searchString = "";
    private List<AaApp> applications;
    private AaApp application = new(); 
    MudMessageBox msgBox { get; set; }


    private async void DeleteUser(int id, string name)
    {
        var msgText = "Are you sure you want to delete: <b>" + name + "</b>.";
        bool? result = await _dialogService.ShowMessageBox("Delete Confirmation",(MarkupString) msgText, yesText: "Delete", cancelText: "Cancel");

 
        if (result ?? false)
        {
            //delete from database
            db.DeleteApp(id);

            //Remove and re-sort list.  
            applications.RemoveAll(i => i.Id == id);
            applications = applications.OrderBy(a => a.Name).ToList();
        }

    }

    protected override async Task OnInitializedAsync()
    {
        applications = await db.GetApps();
    }

    private async Task CreateAsync()
    {
        var parameters = new DialogParameters();
        parameters.Add("application", new AaApp());

        var dialog = await _dialogService.Show<AddOrUpdateDialog>("Creat A New App", parameters).Result;

        if (dialog.Data != null)
        {
            AaApp newApp = dialog.Data as AaApp;

            db.InsertApp(newApp);

            NavigationManager.NavigateTo("Groups");
        }
    }

    private bool Search(AaApp app)
    {
        if (app.Name is not null && app.Name.Contains(searchString, StringComparison.OrdinalIgnoreCase))
        {
            return true;
        }
        return false;
    }
}
Для развертывания Сайтов с использованием Blazor, Angular и React с репозиторием на GitHub на Cloudflare
Для развертывания Сайтов с использованием Blazor, Angular и React с репозиторием на GitHub на Cloudflare
Как развернуть сайты с помощью Blazor, Angular и React с репозиторием на GitHub на Cloudflare.
0
0
38
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Я попробовал ваш код без MudDialog, и он отлично работает. Когда я использовал диалоговое окно, у меня был тот же результат, поэтому я вызвал метод StateHasChanged, и все заработало нормально.

        applications.RemoveAll(i => i.Id == id);
        applications = applications.OrderBy(a => a.Name).ToList();
        StateHasChanged();

Спасибо. Да, похоже, это исправление. Я предполагаю, что это связано с диалогом. В своей вставке я делаю собственный диалог с той же концепцией обновления базы данных, а затем добавляю ее в список для отображения, и это работает.

Caverman 05.04.2022 02:27

Другие вопросы по теме