Blazor：内置 @on{EVENT} 和自定义 EventCallback 的区别

Question

如果这个问题看起来很愚蠢，请见谅；但我对@前缀的使用感到困惑。

当将鼠标悬停在内置事件上时，例如onclickVisual Studio 中的 IntelliSense 显示事件类型（onclick在本例中）是，Microsoft.AspNetCore.Components.EventCallback并且EventCallback在组件中实现时，类型显然又是Microsoft.AspNetCore.Components.EventCallback;

但是为什么诸如onclick应该以@while EventCallback(s)为前缀的内置事件应该像属性一样声明（没有@as 前缀）？

Answer 1

如果这个问题看起来很愚蠢，请见谅；但我对@ 前缀的使用感到困惑。

完全没有...这是一个非常重要的问题，Blazor 中的所有开发人员不仅应该能够回答，而且还应该能够采取行动。

属性“@onclick”是一个编译器指令，指示编译器创建一个 EventCallback 'delegate'。EventCallback 是一个存储对委托的引用的结构体；那是一个方法，它实际上是您分配给属性“@onclick”的值，例如：

<button type="button" @onclick="ClickMe">Click me</button>

@code
{
     private void ClickMe()
    {
       Console.WriteLine("You clicked me...");
    }
}

如您所见ClickMe，当您单击按钮时会调用一个方法。

您还可以使用不带 @ 符号的 Html 元素属性“onclick”。这当然不是编译器指令而是 Html 元素属性，对吗？它的值只能是一个 JavaScript 函数，例如：

<button type="button" onclick="window.ClickMe()">Click me</button>

现在，当您单击按钮时，将调用ClickMe在 window 对象上定义的名为 的 JavaScript 函数...注意圆括号。

当然，有多种方法可以执行上述操作。

在您发布的照片​​中，Modal 组件有一个名为onOK的属性，其类型为EventCallback，因此其值应该是一个合适的方法，ModalOnOK。以下代码片段说明了这一点：

Modal.razor（Modal 的定义）

@code{
    [Parameter]
    public EventCallBack onOK {get; set;}
}

如您所见，onOK是一个类型为 的参数属性EventCallBack。因此，在使用 Modal 组件的父组件中，您应该为 property 属性分配EventCallBack可以封装的方法的值。

对不起，有很多很多要说的，这只是材料的一小部分。但是是时候分开了。

希望这可以帮助...