Search
Download
聚焦模式
字号
组件概述
Search 是一个功能完整的搜索解决方案，包含了搜索框、搜索结果展示、高级搜索等功能的完整组件集合。适用于即时通信、在线会议、在线教育等场景的用户、群组、消息搜索。
说明：
搜索模式
迷你模式 | 标准模式 | 嵌入式模式 |
适用于侧边栏或小容器 显示有限结果数量 支持展开查看更多 | 适用于全屏搜索界面 完整功能展示 支持高级搜索 | 适用于聊天界面 专注消息搜索 优化的布局 |
 |  |  |
Props
属性名 | 类型 | 默认值 | 说明 |
variant | VariantType | VariantType.MINI | 搜索模式：mini(迷你)、standard(标准)、embedded(嵌入式) |
className | string | - | 自定义样式类名 |
style | React.CSSProperties | - | 自定义样式 |
onKeywordChange | (keyword: string) => void | - | 搜索关键词变化回调 |
onResultItemClick | (result: object) => void | - | 搜索结果点击回调 |
基础使用
import { Search, VariantType } from '@tencentcloud/chat-uikit-react';function App() {return (<Search variant={VariantType.MINI} />);}
常见问题
Q: 如何自定义搜索结果的显示格式？
A: 搜索组件不支持自定义，可以使用 SearchStore 自主实现 Search 组件。
文档反馈