EventCallback<string> OnClick 定义了一个名为OnClick的事件，EventCallback的泛型参数就是事件的参数类型。
OnClick.InvokeAsync("Superior") 调用这个事件，让注册的方法执行，注意事件调用前通过OnClick.HasDelegate判断事件是否有被注册，如果没有任何方法注册此事件，那么调用会发生异常。
OnClick="OnClick" 将OnClick方法注册给事件。 3.方法
组件对外暴露的方法，提供外部组件调用。
<!--组件代码--> <h1>Blazor is @Text!</h1> @code { private string Text { get; set; } public void SetText(string text) { Text = text; StateHasChanged(); } } <!--组件使用--> <Component @ref="@component"></Component> <button @onclick="OnClick">Button</button> @code { private Component component; void OnClick(MouseEventArgs e) { component.SetText("Superior"); } }当点击Button按钮触发@onclick事件，通过Component组件的SetText方法设置组件的Text值，组件就输出Blazor is Superior!
@ref 想要获得某个组件的实例，可以使用@ref特性，在这里他会把Component组件的实例填充到component变量中。此处注意，@ref的应用只有在组件完成呈现后才完成。
参数只提供了外部组件向组件单向赋值，数据绑定就是双向赋值。
对于原始的Html元素与Razor组件在数据绑定的使用上有一些细微差别，下面分开介绍。
Html 元素使用通过名为 @bind 的 Html 元素特性提供了数据绑定功能。
<h4>Blazor is @Text!</h4> <input @bind="Text" /> @code { private string Text; }
把Text变量绑定到input组件，当input中完成输入且离开焦点后输出Blazor is Superior!。
如果我们想要输入时立即显示输入的内容，我们可以通过带有 event 参数的 @bind:event 属性将绑定指向 oninput 事件。
<h4>Blazor is @Text!</h4> <input @bind="Text" @bind:event="oninput"/> @code { private string Text; }
Html元素绑定实现原理
Html元素本身并不支持双向属性绑定机制，当我们使用@bind后，Blazor帮我们生成了value="@Text"实现向Html元素赋值，再生成@onchange事件实现Html元素向绑定变量赋值。 <input value="@Text" @onchange="@((ChangeEventArgs __e) => Text = __e.Value.ToString())" /> @code { private string Text { get; set; } } 5.嵌套
组件嵌套就是允许一个组件成为另一组件的容器，通过父与子的层层嵌套实现各种复杂的界面，在这过程中我们也能提炼出相似的组件，加以重复使用和共享。
下面是“我的一天”界面的代码以及他们组件的嵌套结构
组件可以设置自己的某一个位置插入其他组件的内容。
<!--组件代码--> <h1>Blazor is @ChildContent</h1> @code{ [Parameter] public RenderFragment ChildContent { get; set; } } <!--组件使用--> <Component> <strong>Superior!</strong> </Component>
Component具有一个类型为 RenderFragment 的 ChildContent 属性，RenderFragment表示要呈现的 UI 段。
ChildContent 的值是从父组件接收的UI段。
在组件中需要呈现ChildContent内容的地方放置@ChildContent标记。
ChildContent属性命名为固定名字，下例是完整写法，上面是简略写法。
可以通过指定一个或多个 RenderFragment 类型的组件参数来接收多个UI段。
<!--组件代码--> <h1>@Title is @Quality</h1> @code{ [Parameter] public RenderFragment Title { get; set; } [Parameter] public RenderFragment Quality { get; set; } } <!--组件使用--> <Component> <Title> <strong>Blazor</strong> </Title> <Quality> <strong>Superior!</strong> </Quality> </Component> 模板参数