使用 Blazor 模态和身份验证状态

Question

I'm trying to use Blazored.Modal with AuthenticationState .

I can't find any documents that shows how to combine these two attributes/keys in the App.Razor file.

Below is how I currently have my App.Razor:

 <CascadingAuthenticationState>
    <Router AppAssembly="@typeof(Program).Assembly" AdditionalAssemblies="@lazyLoadedAssemblies" OnNavigateAsync="@OnNavigateAsync">
        <Found Context="routeData">
                <AuthorizeRouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)">
                <NotAuthorized>
                        @if (!context.User.Identity.IsAuthenticated)
.
.
.
</CascadingAuthenticationState>

I need to insert <CascadingBlazoredModal> somewhere but I have no clue. I've tried adding it below but that seems to create two renders of the page. I tried wrapping the above code with CascadingBlazoredModal, I tried putting CascadingBlazoredModal inside the AuthenticationState.

The only docs I see are around CascadingValues/Params but that's not what I'm looking for.

Any help would be appreciate it!

Thank you!

Answer 1

I've not tested this, but from the docs this should work:

<CascadingAuthenticationState>
  <CascadingBlazoredModal>
    <Router AppAssembly="typeof(Program).Assembly">
        ...
    </Router>
 </CascadingBlazoredModal>
</CascadingAuthenticationState>

You should be able to pick up the cascaded value in your modal hosted forms.

[CascadingParameter] public Task<AuthenticationState> AuthTask { get; set; }

Answer 2

I got it to work! Not sure if it's the best option but...

I had to wrap the CascadingBlazoredModal around the Authenticationstate ... AND add authenticationstate within the Found ...

If I don't wrap the whole Router with the AuthenticationState I wouldn't be able to access the whole app but just the page I authenticated myself with (sigh)..

<CascadingBlazoredModal> 
    <CascadingAuthenticationState>
        <Router AppAssembly="@typeof(Program).Assembly" AdditionalAssemblies="@lazyLoadedAssemblies" OnNavigateAsync="@OnNavigateAsync">
            <Found Context="routeData">
                <CascadingAuthenticationState>
                    <AuthorizeRouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
                </CascadingAuthenticationState>
            </Found>
.
.
.