SxMenuButton (菜单按钮)
- Implemented
SxButton 与 SxMenu 的快捷复合组件。对齐 Microsoft Fluent UI Blazor MenuButton (v4.13.2) 的 API 结构，并说明 NextUI 当前实现状态。
使用场景
- 操作菜单触发器
- 工具栏快捷菜单
- 列表项操作入口
约束说明
Trigger提供时会忽略TriggerText与TriggerIcon。UseMenuService控制是否使用统一菜单服务。
行为说明
- 点击触发按钮切换菜单显示。
- 触发按钮样式由
Trigger*参数控制。
API
Parameters (参数)
| 状态 | 参数名 | 类型 | 默认值 | 描述 |
|---|---|---|---|---|
| Implemented | ChildContent |
RenderFragment? |
null |
菜单内容。 |
| Implemented | Trigger |
RenderFragment? |
null |
自定义触发器内容。 |
| Implemented | TriggerText |
string? |
null |
触发按钮文案。 |
| Implemented | TriggerIcon |
string? |
null |
触发按钮图标。 |
| Implemented | TriggerClass |
string? |
null |
触发按钮类名。 |
| Implemented | TriggerAppearance |
ButtonAppearance |
Neutral |
按钮风格。 |
| Implemented | TriggerShape |
ButtonShape |
Rounded |
按钮形状。 |
| Implemented | TriggerSize |
ControlSize |
Medium |
按钮尺寸。 |
| Implemented | Placement |
MenuPlacement |
Auto |
菜单弹出位置。 |
| Implemented | Alignment |
MenuAlignment |
Start |
菜单对齐方式。 |
| Implemented | UseMenuService |
bool |
true |
是否使用 MenuService。 |
| Implemented | Disabled (继承) |
bool |
false |
是否整体禁用。 |
| Implemented | Id (继承) |
string? |
null |
组件的物理 Id。 |
| Implemented | Class (继承) |
string? |
null |
自定义 CSS 类名。 |
| Implemented | Style (继承) |
string? |
null |
自定义样式。 |
| Implemented | Title (继承) |
string? |
null |
HTML title 属性。 |
| Implemented | AdditionalAttributes (继承) |
IEnumerable<KeyValuePair<string, object>>? |
null |
捕获不匹配的 HTML 属性。 |
Events (事件)
| 状态 | 事件名 | 类型 | 描述 |
|---|---|---|---|
| Implemented | OnMenuChanged |
EventCallback<MenuChangeEventArgs> |
菜单项被选择时触发。 |
示例
<SxMenuButton TriggerText="操作">
<SxMenuItem Text="编辑" />
<SxMenuItem Text="删除" />
</SxMenuButton>
MenuService 功能
当 UseMenuService 为 true 且 MenuService 已注册时，菜单按钮将获得以下增强功能：
- 统一管理：所有菜单由服务统一管理，避免冲突
- 自动 z-index：自动管理层级，确保正确的显示顺序
- ESC 键处理：按 ESC 键自动关闭当前活动的菜单
- 性能优化：共享事件监听器，减少资源消耗