Blazor 布局在页面导航上重新创建？

问题描述 投票：0回答：1

每当我单击 Blazor 中的 

<NavLink>
（服务器 和 WASM，无论是哪一个）时，我的整个布局都会重新创建，而不仅仅是 
@Body
/
@page
组件。

我的理解是发生这种情况是因为布局位于

<Router>
内部，并且路由器只是在页面更改时重新创建整个内容。问题是，每当我导航时，我都会丢失侧边栏的状态（调用 
OnInitialized()
方法）。

我发现这篇 GitHub 帖子（与我的问题没有直接关系），其中 Microsoft 的解决方案基本上是将布局移至路由器外部，但随后你基本上就陷入了应用程序范围的“布局” 。最重要的是，我能找到的所有文档和教程都没有提到这个问题。

我确信我只是错过了一些简单的东西。当然，Blazor 的路由器足够智能，只能重新创建 

@Body
RenderFragment
并保留布局的当前状态，不是吗？我见过很多网站，导航不会重新呈现整个应用程序。 MudBlazor 的文档页面就是其中一个，查看 他们的文档源代码，他们似乎没有对他们的布局做任何特别的事情。

我应该做一些比这更复杂的事情吗？

<Router AppAssembly="@typeof(App).Assembly">
    <Found Context="routeData">
        <AuthorozeRouteView Resource="routeData" 
                            RouteData="routeData" 
                            DefaultLayout="@typeof(MainLayout)"/>
    </Found>
    <NotFound>
        <PageTitle>Not found</PageTitle>
        <LayoutView Layout="@typeof(MainLayout)">
            <p role="alert">Sorry, there's nothing at this address.</p>
        </LayoutView>
    </NotFound>
</Router>
asp.net-core blazor
1个回答
0
投票

您的交互设置在哪里？ [全局或每页/组件]。

当您期望它是全局时，它看起来像页面/组件。

如果是这样，请在 App.razor 中全局添加渲染模式：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <base href="/" />
    <link rel="stylesheet" href="bootstrap/bootstrap.min.css" />
    <link rel="stylesheet" href="app.css" />
    <link rel="stylesheet" href="SO78295291.styles.css" />
    <link rel="icon" type="image/png" href="favicon.png" />
    // Set render mode here
    <HeadOutlet @rendermode="InteractiveServer" />
</head>

<body>
    // Set render mode here
    <Routes @rendermode="InteractiveServer" />
    <script src="_framework/blazor.web.js"></script>
</body>

</html>
最新问题
© www.soinside.com 2019 - 2024. All rights reserved.