Blazor带我重玩前端(四)

Blazor中的布局和MVC中的布局是类似的。

创建布局

新建一个Razor页面，所有新增的布局都要继承LayoutComponentBase，同时标识自定义内容的输出位置，即标识Body的位置。如图所示：

应用布局

我们修改一下index.razor页面中的代码，增加@layout MyLayout。运行后，按F12查看网页源代码如下：

布局的内容被<app></app>标签包着，这也意味着，我们的layout并不是页面的全部内容，而仅仅只是blazor相关的内容。

顺便说一下，布局是可以“继承”的，也就是说，我们可以声明一个新的布局继承自MainLayout.razor ，只需要指定如下代码即可：

1: @inherits LayoutComponentBase 2: @layout MainLayout