Почему в некоторых случаях страница не обновляется?

Я создаю сайт с помощью Blazor. На странице у меня есть 6 радиобаттонов для выбора вида списка (Overzichten <=> Previews) и 3 радиобаттона для установки параметров (... van hitlijsten <=> from charts). Когда я выбираю другой список, страница обновляется с новым списком на странице. Когда я выбираю другой график, то ничего не обновляется.

Чего мне не хватает в моем коде? Что я делаю неправильно?

            // In the parent:

        <ul class="list-group lists" role="group">
            <li class="list-group-item subheader">Overzichten...</li>
            <li class="list-group-item lists">
                <input id="nummer1" name="overzichtgroep" type="radio" autocomplete="off" checked @onchange="@SetSelectedView" value="1" /> Alle nummer 1 hits
            </li>
            <li class="list-group-item lists">
                <input id="tipVanDeWeek" name="overzichtgroep" type="radio" autocomplete="off" @onchange="@SetSelectedView" value="2" /> Alle tips van de week
            </li>
...

        <ul class="list-group lists" role="group">
            <li class="list-group-item subheader">... van hitlijsten</li>
            <li class="list-group-item lists">
                <input id="songs" name="hitlijstengroep" type="radio" autocomplete="off" checked @onchange="@SetSelectedView" value="7" /> Songs
            </li>
            <li class="list-group-item lists">
                <input id="albums" name="hitlijstengroep" type="radio" autocomplete="off" @onchange="@SetSelectedView" value="8" /> Albums
            </li>
            <li class="list-group-item lists">
                <input id="nlV" name="hitlijstengroep" type="radio" autocomplete="off" @onchange="@SetSelectedView" value="9" /> Songs NL/V
            </li>
        </ul>

            
                @switch (_previewId)
                {
                    case 1:
                        <div class="row lists">
                            <AllNumber1Hits ListId=@_ListId ListName=@_ListName @ref="_allNumber1Hits" />
                        </div>
                        break;
                    case 2:
                        <div class="row lists">
                            <AllNumber1Tips ListId=@_ListId ListName=@_ListName @ref="_allNumber1Tips" />
                        </div>
                        break;
                    case 3:
        
        .... until case 6.
        
    @code {
        private int _previewId { get; set; } = 1;
        private int _chartId { get; set; } = 7;
        private int _listId { get; set; } = 1;
        private string _listName { get; set; } = "Songs";
        protected override void OnInitialized()
        {
            try
            {
                UpdateView(1);
            }
            catch (AccessTokenNotAvailableException exception)
            {
                exception.Redirect();
            }
        }
                    private void UpdateView(int id)
                    {
                        if (id > 0 && id < 7)
                            _previewId = id;
                        else if (id > 6 && id < 10)
                            _chartId = id;
                
                        switch (_chartId)
                        {
                            case 7:
                                _ListId = 1;
                                _ListName = "Songs";
                                break;
                            case 8:
                                _ListId = 2;
                                _ListName = "Albums";
                                break;
                            case 9:
                                _ListId = 3;
                                _ListName = "Songs NL/V";
                                break;
                        }
                    }
                
                    private void DoRefresh()
                    {
                        if (_allNummer1Hits != null)
                            _allNummer1Hits.Refresh();
        
                        if (_allNummer1Tips != null)
                            _allNummer1Tips.Refresh();
                    }
                
                
                    public void SetSelectedView(ChangeEventArgs args)
                    {
                        if (args != null && args.Value != null)
                        {
                            int id;
                            int.TryParse(args.Value.ToString(), out id);
                
                            UpdateView(id);
                            DoRefresh();
                        }
                    }
            
                
               // In the child:
            
               @code
                {
                    private List<AllNumber1HitsModel> model { get; set; }
                    [Parameter] public int ListId { get; set; }
                    [Parameter] public string ListName { get; set; } = string.Empty;
                
                    protected override async Task OnInitializedAsync()
                    {
                        try
                        {
                            model = await _statisticsService.GetAllNumber1Hits(ListId, ListName);
                        }
                        catch (AccessTokenNotAvailableException exception)
                        {
                            exception.Redirect();
                        }
                    }
                
                    public void Refresh() 
                    { 
                        StateHasChanged(); 
                    }
                }

Ваш код недостаточен для выявления проблемы.

Nick 12.09.2022 16:03

Я добавил часть радиобаттонов и добавил частные свойства.

user1531040 12.09.2022 16:30
Получение данных из формы с помощью JavaScript - краткое руководство
Получение данных из формы с помощью JavaScript - краткое руководство
Получить данные из формы с помощью JS очень просто: вы запрашиваете элемент формы, передаете его конструктору new FormData() и, наконец, получаете...
Пользовательские правила валидации в Laravel
Пользовательские правила валидации в Laravel
Если вы хотите создать свое собственное правило валидации, Laravel предоставляет возможность сделать это. Создайте правило с помощью следующей...
3 метода стилизации элементов HTML
3 метода стилизации элементов HTML
Когда дело доходит до применения какого-либо стиля к нашему HTML, существует три подхода: встроенный, внутренний и внешний. Предпочтительным обычно...
Формы c голосовым вводом в React с помощью Speechly
Формы c голосовым вводом в React с помощью Speechly
Пытались ли вы когда-нибудь заполнить веб-форму в области электронной коммерции, которая требует много кликов и выбора? Вас попросят заполнить дату,...
Стилизация и валидация html-формы без использования JavaScript (только HTML/CSS)
Стилизация и валидация html-формы без использования JavaScript (только HTML/CSS)
Будучи разработчиком веб-приложений, легко впасть в заблуждение, считая, что приложение без JavaScript не имеет права на жизнь. Нам становится удобно...
Flatpickr: простой модуль календаря для вашего приложения на React
Flatpickr: простой модуль календаря для вашего приложения на React
Если вы ищете пакет для быстрой интеграции календаря с выбором даты в ваше приложения, то библиотека Flatpickr отлично справится с этой задачей....
1
2
86
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

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

Я изменил свой код, используя событие OnParameterSet. ... и затем я использую тот же код как OnInitialize.

Это работает нормально:

protected override async Task OnParametersSetAsync()
{
    await UpdateList();
}

protected override async Task OnInitializedAsync()
{
    try
    {
        await UpdateList();
    }
    catch (AccessTokenNotAvailableException exception)
    {
        exception.Redirect();
    }
}

private async Task UpdateList()
{
    model = await _allStatisticsService.GetAllNumber1Hits(ListId, ListName);
}

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