SxButton (按钮)
- Implemented
基础交互组件。遵循 Microsoft Fluent UI Blazor (Button) 官方 v4.13.2 规格。
API
Parameters (参数)
| 状态 | 参数名 | 类型 | 默认值 | 描述 |
|---|---|---|---|---|
| [x] | AccessKey (继承) |
string? |
null |
元素的快捷键。 |
| [x] | Action |
string? |
null |
关联的操作标识。 |
| [x] | AdditionalAttributes (继承) |
IEnumerable<KeyValuePair<string, object>>? |
null |
捕获不匹配的 HTML 属性。 |
| [x] | Appearance |
ButtonAppearance |
Neutral |
视觉风格:Neutral, Accent, Outline, Lightweight, Stealth。 |
| [x] | Autofocus |
bool? |
null |
页面加载时自动获取焦点。 |
| [x] | BackgroundColor |
string? |
null |
覆盖背景颜色 (CSS)。 |
| [x] | Class (继承) |
string? |
null |
自定义 CSS 类名。 |
| [x] | Color |
string? |
null |
覆盖文字颜色 (CSS)。 |
| [x] | Disabled (继承) |
bool |
false |
是否禁用交互。 |
| [x] | Fluid (扩展) |
bool |
false |
是否占满父容器宽度。 |
| [x] | Href |
string? |
null |
链接地址,提供后渲染为 <a>。 |
| [x] | IconEnd |
string? |
null |
后置图标名。 |
| [x] | IconStart |
string? |
null |
前置图标名。 |
| [x] | IconStyle (扩展) |
IconStyle |
Regular |
图标风格。 |
| [x] | Id (继承) |
string? |
null |
组件的物理 Id。 |
| [x] | Loading (继承) |
bool |
false |
是否处于加载状态。 |
| [x] | LoadingText (扩展) |
string? |
null |
加载时显示的提示文字。 |
| [x] | Required |
bool |
false |
是否必填(用于表单)。 |
| [x] | Shape (扩展) |
ButtonShape |
Rounded |
形状:Rounded, Square, Circular。 |
| [x] | Size (扩展) |
ControlSize |
Medium |
尺寸:Small, Medium, Large。 |
| [x] | StopPropagation |
bool |
false |
是否阻止事件冒泡。 |
| [x] | Style (继承) |
string? |
null |
自定义内联样式。 |
| [x] | TabIndex (继承) |
int? |
null |
元素的 Tab 顺序。 |
| [x] | Target |
string? |
null |
链接目标 (如 _blank)。 |
| [x] | Title (继承) |
string? |
null |
HTML title 属性。 |
| [x] | Type |
SxButtonType |
Button |
按钮类型:Button, Submit, Reset。 |
| [x] | Value |
string? |
null |
按钮关联的原始值。 |
说明:纯图标按钮(无文字)请提供
AriaLabel或Title以保证可访问性。
HTML(WebComponent) 使用说明
- 建议使用
text="按钮文字"传入文本,避免子文本节点无法被渲染到按钮内部。 - 布尔参数请使用
loading="true"/disabled="true"/fluid="true"的形式。
Events (事件)
| 状态 | 事件名 | 类型 | 描述 |
|---|---|---|---|
| [x] | OnClick |
EventCallback<MouseEventArgs> |
点击按钮时触发。 |