Blazor 中的不同方法调用

Question

我现在正在尝试 Blazor 一段时间，我正在尝试找到关于两者之间差异的解释

<input type="button" onclick="@methodCall()">Something</button>

和

<input type="button" @onclick="() => methodCall()">Something</button>

为什么 @ 在 onclick 之前是预期的，而 @ 是价值的一部分？

Answer 1

当您将“@”放在“onclick”之前时，您就创建了一个编译器指令。如果尚未强制执行，该结构将在将来强制执行。它指示编译器创建一个 EventCallback 对象，该对象提供处理您分配为 @onclick 指令值的代码所需的适当委托。此设置：@onclick="() => methodCall()"告诉编译器生成一个 EventCallback 对象，该对象提供适当的委托来执行 lambda 表达式。请注意，当您想要将值传递给 lambda 表达式封装的方法时，请使用此构造，例如：

@onclick="() => methodCall('Hello world')"

无效方法调用（字符串str）{}

如果您不必将值传递给被调用的方法，则应按如下方式构造 @onclick 指令： @onclick="methodCall"或@onclick="@methodCall" “@”符号告诉编译器 @onclick 指令的值是可执行代码，而不仅仅是字符串，在这种情况下将会触发错误。但正如您所看到的，可以省略“@”符号，并且不会引发错误，因为编译器知道它是一个方法名称，并为其创建具有适当委托的 EventCallback 结构对象。

这onclick="@methodCall()"是错误的。它告诉 Blazor 创建一个输入 Html 元素，其值应该是名为“methodCall”的 JavaScript 方法，并且应该在 Blazor (C#) 中定义和执行。没有这样的动物。

您可以使用这样的构造：`onclick =“methodCall（）”，在这种情况下，您需要定义一个名为methodCall的JavaSript方法...

您还可以这样做：onclick="alert('I'm a JavaScript method')"

最重要的是要记住，当您使用 Html 元素属性 onclick 时，其值应该是 JavaScript 方法。这与 @onclick 编译器指令完全不同......

希望这可以帮助...