@onclick支持四种事件绑定方式:无参数直接调用、接收MouseEventArgs获取鼠标信息、用Lambda传自定义值、加:preventDefault阻止默认行为。

Blazor 的 @onclick 是最常用、最直观的事件绑定方式,它让你用 C# 直接响应用户点击,无需写一行 JavaScript。
基础写法:无参数直接调用
只要方法不带参数,直接把方法名写在 @onclick 后面就行:
@code {
private void HandleClick()
{
Console.WriteLine("按钮被点了");
}
}
Blazor 运行时会自动识别这个方法,并在点击时执行。不需要手动传参,也不需要加括号。
获取鼠标信息:使用 MouseEventArgs
如果想拿到点击位置、按键状态(比如是否按了 Ctrl / Shift / 右键),就给方法加一个 MouseEventArgs 参数:
- Blazor 会自动注入这个参数,你不用在 HTML 里写任何东西
- 常见属性有:
ScreenX/ScreenY(屏幕坐标)、ClientX/ClientY(视口坐标)、Button(0=左键,2=右键)、CtrlKey、ShiftKey等
示例:
@code {
private void HandleClick(MouseEventArgs e)
{
if (e.CtrlKey)
Console.WriteLine($"Ctrl+点击,位置:{e.ClientX},{e.ClientY}");
}
}
传自定义值:用 Lambda 表达式
当你要传入固定字符串、数字或组件状态变量时,就得用 @onclick="@(e => Method(param))" 写法:
- 注意括号和
@符号不能少,否则编译报错 - 即使你不使用
e,也要保留参数占位(如e => DoSomething("hello"))
例如:
基于Intranet/Internet 的Web下的办公自动化系统,采用了当今最先进的PHP技术,是综合大量用户的需求,经过充分的用户论证的基础上开发出来的,独特的即时信息、短信、电子邮件系统、完善的工作流、数据库安全备份等功能使得信息在企业内部传递效率极大提高,信息传递过程中耗费降到最低。办公人员得以从繁杂的日常办公事务处理中解放出来,参与更多的富于思考性和创造性的工作。系统力求突出体系结构简明
@code {
private void UpdateStatus(string state)
{
Console.WriteLine($"状态已设为:{state}");
}
}
阻止默认行为:@onclick:preventDefault
有些元素点击后有默认动作(比如表单提交、链接跳转),可以用 @onclick:preventDefault 阻止:
- 写法是紧挨着事件指令,加冒号和 preventDefault,后面不加等号就是“始终阻止”
- 也可以绑定布尔变量或表达式,实现条件阻止
示例(阻止链接跳转):
或者动态控制:
@code {
private void OnKey(KeyboardEventArgs e)
{
// 只有 Enter 被拦截,其他键照常触发
}
}
基本上就这些。掌握这四种模式,就能覆盖绝大多数 @onclick 使用场景。









