SxSearch (搜索框)

  • Implemented

用于执行搜索操作的专用输入框。对齐 Microsoft Fluent UI Blazor Search (v4.13.2) 的 API 结构,并说明 NextUI 当前实现状态。

使用场景

  • 全局搜索入口
  • 列表过滤
  • 快速关键词查询

约束说明

  • Value 为字符串。
  • 清除按钮仅在可编辑且有值时显示。

行为说明

  • 回车触发 OnSearch
  • 点击清除触发 OnClear

API

Parameters (参数)

状态 参数名 类型 默认值 描述
Implemented Value string? null 当前输入值。
Implemented Placeholder string "Search" 占位文案。
Implemented Label string? null 顶部标签。
Implemented Appearance SxInputAppearance Outline 视觉风格。
Implemented IconStart string "magnifying-glass" 左侧图标名称。
Implemented Borderless bool false 是否使用无边框样式。
Implemented Autofocus bool false 自动聚焦。
Implemented AriaLabel string? null aria-label
Implemented ReadOnly bool false 只读状态。
Implemented Required bool false 必填状态。
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 额外属性。

Events (事件)

状态 事件名 类型 描述
Implemented OnClear EventCallback 点击清除触发。
Implemented OnSearch EventCallback<string> 搜索触发。
Implemented ValueChanged EventCallback<string?> 值变化触发。

示例

<SxSearch Placeholder="搜索..." OnSearch="@OnSearch" />

参考设计 (References)