Blazor Fluxor - Issues with state management when using OnInitialized() method in component

Question

I'm having a strange thing on my app. I'm using Blazor (.NET 7) with Fluxor (Vers. 5.7.0) for state management - and I'm new to Blazor and Fluxor. I'm more familiar with Reactjs and Redux. But I think it is a kind of similar. The state management is working fine.

Now I have a new component called SetNewStatus, where I use 2 states. This is the code behind file of this component. It's kind of small.

using Fluxor;
using GUI.Store.ProductStatusUseCase;
using GUI.Store.SelectedProductsUseCase;
using Microsoft.AspNetCore.Components;
using Microsoft.EntityFrameworkCore.Storage;

namespace GUI.Shared.Components
{
    public partial class SetNewStatus
    {
        [Inject]
        private IState<SelectedProductsState> _SelectedProductsState { get; set; }
        [Inject]
        private IState<ProductStatusState> _ProductStatusState { get; set; }

        private List<Data.ComboboxItem> _ProductStatusList = new List<Data.ComboboxItem>();

        protected override void OnInitialized()
        {
        }
        
    }
}

The component is being shown in my Index.razor page, when SelectedProductsState has at least one entry:

From Index.razor:

...
@if (_SelectedProductsState.Value.SelectedProducts.Count > 0)
{
    <div class="row mt-2">
        <div class="col">
            <GUI.Shared.Components.SetNewStatus />
        </div>
    </div>
}
...

The state SelectedProductsState is for saving/collecting all selected products in a list. If I select the first product from the list, everything is working fine. It shows me one selected product in the SetNewStatus component. If I select more products, the state in this component is showing me still 1 selected product.

I already checked the state management. I can see in the Redux development tools and when debugging, that more products are in the state. When I deselect all products from the list, I get an error on a completely different location and component where is says:

"Cannot access a disposed object"

I don't understand why this is happening. But here comes the really strange thing for me:

When I remove the OnInitialized method on the SetNewStatus component, everything works fine. No error, no missing state update.

But actually I need the OnInitialized method to perform some actions once.

How can I investigate this issue further?

Answer 1

Now I have found the reason. In the OnInitialized method in SetNewStatus, the base.OnInitialized(); was missing.

    protected override void OnInitialized()
    {
        base.OnInitialized();
    }

After adding this, everything is working as expected!

[Added by @MrC]

The reason for this is that FluxorComponent has the following code in OnInitialized

        protected override void OnInitialized()
        {
            base.OnInitialized();
            StateSubscription = StateSubscriber.Subscribe(this, _ =>
            {
                StateHasChangedThrottler.Invoke(MaximumStateChangedNotificationsPerSecond);
            });
        }