Blazor Server Side - значение, измененное в дочерней функции, не обновляет пользовательский интерфейс

Question

Итак, что я делаю здесь, у меня есть индикатор выполнения в моем дочернем компоненте (RMSBaseComponent.razor), который окружен условной переменной «IsLoading»

<div style="padding:20px">

@* Page Title *@
<h3>@PageTitle</h3>
<MatDivider></MatDivider>

@* Loader *@
@if (IsLoading)
{
    <MatProgressBar Indeterminate="true"></MatProgressBar>
}
</div>

Я делаю этот дочерний элемент в Parent (AddNewCity.razor) как

<RMSBaseComponent PageTitle="Add New City" @ref="BaseComponent">

</RMSBaseComponent>

Здесь я получаю ссылку на дочерний элемент в переменной «BaseComponent», но когда я изменяю значение «IsLoading» из класса родительского компонента (AddNewCity.cs), он делает не обновлять пользовательский интерфейс и не отображать пользовательский интерфейс "MatProgressBar". Я меняю значение, как показано ниже

public partial class AddNewCity
{
    private RMSBaseComponent BaseComponent { get; set; }

    protected override void OnAfterRender(bool firstRender)
    {
        base.OnAfterRender(firstRender);

        Thread.Sleep(3000);
        BaseComponent.IsLoading = true;
    }
}

Любая помощь будет оценена.

Спасибо

Answer 1

Вам следует позвонить StateHasChanged() после Thread.Sleep()

public partial class AddNewCity
    {
        private RMSBaseComponent BaseComponent { get; set; }

        protected override void OnAfterRender(bool firstRender)
        {
            base.OnAfterRender(firstRender);

            Thread.Sleep(3000);
            BaseComponent.IsLoading = true;
            StateHasChanged();
        }
    }