C#•2y ago•

2 replies

Blazor Problems with Layouts

Hello! I've been spending a few days trying to figure out what is going on here, I think I've boiled it down to how the Layouts are working. I'm new to Blazor and I don't fully understand what's going on with Layouts, but I've read the docs and I think I sorta understand what they are and do.

I know I asked for this to happen when I took all of the account-related pages from the Blazor template and spliced it into my project here. I go to log in and everything works fine as the stand alone page, creating a user works, logging in works, but the rest of my website seems to be "frozen" when I'm on these account related pages. I can't click on my app drawer, or toggle dark mode, and it seems like my theme is reverted.

I'm using MudBlazor if that matters here. I think it has something to do with Layouts because the Login page uses the

AccountLayout.razor

AccountLayout.razor

layout, as well as all the other account related pages, through the

_Imports.razor

_Imports.razor

file. The

AccountLayout.razor

AccountLayout.razor

file also has

@layout TrustyPortfolio.Components.Layout.MainLayout

@layout TrustyPortfolio.Components.Layout.MainLayout

which should mean that it still uses my

MainLayout.razor

MainLayout.razor

right? I havent' changed anything in my

Routes.razor

Routes.razor

so I'm still using

DefaultLayout="typeof(Layout.MainLayout)"

DefaultLayout="typeof(Layout.MainLayout)"

.

At this point I'm stuck.

AccountLayout.razor

AccountLayout.razor

looks like this

@inherits LayoutComponentBase
@layout TrustyPortfolio.Components.Layout.MainLayout
@inject NavigationManager NavigationManager

@if (HttpContext is null)
{
    <p>Loading...</p>
}
else
{
    @Body
}

@code {
    [CascadingParameter]
    private HttpContext? HttpContext { get; set; }

    protected override void OnParametersSet()
    {
        if (HttpContext is null)
        {
            // If this code runs, we're currently rendering in interactive mode, so there is no HttpContext.
            // The identity pages need to set cookies, so they require an HttpContext. To achieve this we
            // must transition back from interactive mode to a server-rendered page.
            NavigationManager.Refresh(forceReload: true);
        }
    }
}

@inherits LayoutComponentBase
@layout TrustyPortfolio.Components.Layout.MainLayout
@inject NavigationManager NavigationManager

@if (HttpContext is null)
{
    <p>Loading...</p>
}
else
{
    @Body
}

@code {
    [CascadingParameter]
    private HttpContext? HttpContext { get; set; }

    protected override void OnParametersSet()
    {
        if (HttpContext is null)
        {
            // If this code runs, we're currently rendering in interactive mode, so there is no HttpContext.
            // The identity pages need to set cookies, so they require an HttpContext. To achieve this we
            // must transition back from interactive mode to a server-rendered page.
            NavigationManager.Refresh(forceReload: true);
        }
    }
}

And I think it has something to do with the Layouts because I can see this page and its "loading" text in my theme and with buttons working, right before it goes to the login page.

Any help or direction would be greatly appreciated

Blazor Problems with Layouts

AccountLayout.razor

AccountLayout.razor

layout, as well as all the other account related pages, through the

_Imports.razor

_Imports.razor

file. The

AccountLayout.razor

AccountLayout.razor

file also has

@layout TrustyPortfolio.Components.Layout.MainLayout

@layout TrustyPortfolio.Components.Layout.MainLayout

which should mean that it still uses my

MainLayout.razor

MainLayout.razor

right? I havent' changed anything in my

Routes.razor

Routes.razor

so I'm still using

DefaultLayout="typeof(Layout.MainLayout)"

DefaultLayout="typeof(Layout.MainLayout)"

.

At this point I'm stuck.

AccountLayout.razor

AccountLayout.razor

looks like this

@inherits LayoutComponentBase
@layout TrustyPortfolio.Components.Layout.MainLayout
@inject NavigationManager NavigationManager

@if (HttpContext is null)
{
    <p>Loading...</p>
}
else
{
    @Body
}

@code {
    [CascadingParameter]
    private HttpContext? HttpContext { get; set; }

    protected override void OnParametersSet()
    {
        if (HttpContext is null)
        {
            // If this code runs, we're currently rendering in interactive mode, so there is no HttpContext.
            // The identity pages need to set cookies, so they require an HttpContext. To achieve this we
            // must transition back from interactive mode to a server-rendered page.
            NavigationManager.Refresh(forceReload: true);
        }
    }
}

@inherits LayoutComponentBase
@layout TrustyPortfolio.Components.Layout.MainLayout
@inject NavigationManager NavigationManager

@if (HttpContext is null)
{
    <p>Loading...</p>
}
else
{
    @Body
}

@code {
    [CascadingParameter]
    private HttpContext? HttpContext { get; set; }

    protected override void OnParametersSet()
    {
        if (HttpContext is null)
        {
            // If this code runs, we're currently rendering in interactive mode, so there is no HttpContext.
            // The identity pages need to set cookies, so they require an HttpContext. To achieve this we
            // must transition back from interactive mode to a server-rendered page.
            NavigationManager.Refresh(forceReload: true);
        }
    }
}

Blazor Problems with Layouts

Blazor Problems with Layouts

Similar Threads

Similar Threads

Similar Threads