RadzenSidebar: Null when OnInitialized

Radzen Blazor Studio
1

I'm trying to do something I would assume is fairly simple. I want my sidebar to initialize as 'closed' or Expanded = false; but it appears as though the component doesn't yet exist during OnInitialized or OnInitializedAsync. What's the proper approach to set initial states of objects?


<RadzenSidebar Responsive="false" @ref="mainMenu" >
        <RadzenPanelMenu @ref=menuList ShowArrow="false">
            <RadzenPanelMenuItem Text="Dashboard" Icon="dashboard"  Path="dashboard" />
            <RadzenPanelMenuItem Text="Products" Icon="inventory"  Path="products" />......

protected override void OnInitialized()
{
    base.OnInitialized();
    mainMenu.Expanded = false;  //<-- Null Here
}

void ToggleMenu()
{
    if (mainMenu.Expanded)
    {
        mainMenu.Style = "width: 50px; position: absolute";
        menuList.DisplayStyle = MenuItemDisplayStyle.Icon;
        sideBarClass = "";
        mainMenu.Expanded = false;
    }
    else
    {
        mainMenu.Style = "width: 200px; position: absolute";
        menuList.DisplayStyle = MenuItemDisplayStyle.IconAndText;
        sideBarClass = "";
        mainMenu.Expanded = true;
    }

    //Console.WriteLine("Menu state: " + mainMenu.Expanded);
}

crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]
      Unhandled exception rendering component: Object reference not set to an instance of an object.
System.NullReferenceException: Object reference not set to an instance of an object.

Part of the weirdness here is that I'm also trying to leverage an 'Overlay + Icons' effect instead of pushing the page content over when expanded (as most websites do), so I adjust the style on the fly.

2

Ah, got it, I just moved my code into OnSetParameters...


    protected override void OnParametersSet()
    {
        base.OnParametersSet();

        mainMenu.Style = "width: 50px; position: absolute";
        menuList.DisplayStyle = MenuItemDisplayStyle.Icon;
        sideBarClass = "";
        mainMenu.Expanded = false;
    }
3

Component references are no available at this stage in the lifecycle - you should use binding for the property instead.

4

This is how Blazor component references works in general. It isn't specific to the Radzen Blazor components. You should use databinding instead. Set the Expanded attribute to a property or field of your own:

<RadzenSidebar Expanded="@expanded">

or

<RadzenSidebar @bind-Expanded="@expanded">