If else function for active or deactive @layout blazor

Question

我想为活动或非活动@layout 制作其他 function。 但它不工作 @layout 始终处于活动状态。

@if (showTable == true)
{
    @layout TransactionLayout
}

Answer 1

根据Blazor 的文档，布局在编译时被定义为一个属性：

使用 Razor 指令 @layout 将布局应用于组件。 编译器将@layout 转换为一个LayoutAttribute，该属性应用于组件class。

由于布局被应用为 class 属性，我怀疑你可以在运行时更改它。

我建议您在没有布局的情况下定义一次组件，然后在另一个具有布局的组件中使用它 - 并在运行时决定要渲染哪个组件。

例如：

//MyComponent.razor
<!-- your component here, without the layout -->

然后：

//MyComponentWithLayout.razor
@layout TransactionLayout

<MyComponent />

最后，在您的主要组件或页面中，您可以执行以下操作：

@if(showTable)
{
    <MyComponentWithLayout />
}
else
{
    <MyComponent />
}

Answer 2

这不是 Blazor 当前处理布局的方式......

请打开 App.razor 组件并找到 RouteView 元素。 这个 class 有一个名为 DefaultLayout 的属性，其中设置了应用程序的默认布局 (MainLayout)。

现在，您应该从RouteView class 派生，添加两个属性来表示活动或非活动布局。 做这样的事情：

MyRouteView.cs

public class MyRouteView : RouteView
{
   // Define necessary properties
        [Parameter]
        public Type ActivatedLayout { get; set; }

        [Parameter]
        public Type DeactivatedLayout { get; set; }

      // Add more code to do the work of activating and deactivating the layout
}

希望这可以帮助...