Blazor组件概述

所有渲染的Blazor视图均来自ComponentBase类，其中包括Layouts，Pages和Components。

Blazor页面本质上是具有@page指令的组件，该指令指定浏览器必须导航到的URL，以便呈现该URL。实际上，如果我们比较组件和页面的生成代码，则几乎没有什么不同。可以在Counter.razor.g.cs中的obj \ Debug \ netcoreapp3.0 \ Razor \ Pages文件夹中找到以下生成的源代码。

    namespace MyFirstBlazorApp.Client.Pages
    {
        [Microsoft.AspNetCore.Components.LayoutAttribute(typeof(MainLayout))]
        [Microsoft.AspNetCore.Components.RouteAttribute("/counter")]
        public class Counter : Microsoft.AspNetCore.Components.ComponentBase
        {
            protected override void BuildRenderTree(Microsoft.AspNetCore.Components.RenderTree.RenderTreeBuilder builder)
            {
                // Code omitted for brevity
            }
        private int counter = 42;
        private void IncrementCounter()
        {
            counter++;
        }
      }
    }

[Microsoft.AspNetCore.Components.RouteAttribute（“ / counter”）]标识页面的URL。
[Microsoft.AspNetCore.Components.LayoutAttribute（typeof（MainLayout））]标识要使用的布局。

实际上，由于页面仅仅是装饰有其他属性的组件，因此，如果您更改默认Blazor应用程序的Pages / Index.razor文件，则可以将“Counter”页面作为组件嵌入。

    @page "/"
    <h1>Hello, world!</h1>
    Welcome to your new app.
    <Counter/>

将页面嵌入另一个页面时，Blazor会将其视为组件。嵌入式页面上的LayoutAttribute被忽略，因为Blazor已经有一个显式容器-包含它的父组件。