react search
Release 1.2.0
React-Search 是一个 UI 小部件，只需几行代码即可将 Vectara 支持的语义搜索添加到您的 React 应用程序中。
提示
寻找其他东西？尝试另一个开源项目：
尝试演示！
搜索输入如下所示：
当用户单击搜索输入时，他们会收到如下搜索提示：
搜索结果如下所示：
安装 React-Search：
npm install --save @vectara/react-search然后在您的应用程序中使用它，如下所示：
import { ReactSearch } from "@vectara/react-search" ;
/* snip */
< ReactSearch
customerId = "CUSTOMER_ID"
corpusId = "CORPUS_ID"
apiKey = "API_KEY"
placeholder = "Search" // Optional search input placeholder
isDeepLinkable = { true } // Optional boolean determining if search results will be deep-linked
openResultsInNewTab = { true } // Optional boolean determining if links will open in a new tab
zIndex = { 1000 } // Optional number assigned to the z-index of the search modal
isSummaryToggleVisible = { true } // Optional boolean determining if users can summarize search results
rerankingConfiguration = { {
rerankerId : 272725718
} }
/ > ; customerId （必填）每个 Vectara 帐户都与一个客户 ID 相关联。您可以通过登录 Vectara 控制台并打开右上角的帐户下拉列表来找到您的客户 ID。
corpusId （必填）创建语料库后，您可以通过导航到语料库并查看语料库名称旁边的左上角来找到其 ID。
apiKey （必填）API 密钥使应用程序能够访问语料库内部的数据。了解如何创建QueryService API 密钥。
apiUrl （可选）默认情况下，React-Search 向 Vectara 服务器发送查询请求。如果您想使用代理服务器，您可以使用代理的 URL 来配置此选项。
placeholder （可选）在搜索模式的输入中配置占位符文本。
isDeepLinkable （可选）默认为false 。如果您希望将搜索查询保留到 URL 参数，请设置此选项。这将使用户能够共享 URL 或为其添加书签。加载 URL 将自动打开搜索模式并搜索存储在 URL 中的查询。
openResultsInNewTab （可选）默认为false 。如果您希望在新选项卡中打开搜索结果，请设置此选项。
zIndex （可选）定义搜索模式的 z 索引。
onToggleSummary （可选）接受一个回调，该回调将接收一个布尔参数，指示是否启用“汇总搜索结果”切换。
isSummaryToggleVisible （可选）用户是否能够总结搜索结果。
isSummaryToggleInitiallyEnabled （可选）如果用户可以切换摘要，则默认情况下是否应启用切换。
rerankingConfiguration （可选）指定要使用的搜索结果重新排序器及其配置。有关更多信息，请参阅我们有关重新排名的文档。
安装 React-Search：
npm install --save @vectara/react-search然后在您的应用程序中使用useSearch挂钩，如下所示：
import { useSearch } from "@vectara/react-search/lib/useSearch" ;
/* snip */
const { fetchSearchResults , isLoading } = useSearch (
"CUSTOMER_ID" ,
"CORPUS_ID" ,
"API_KEY" ,
"API_URL" , // optional
{ rerankerId : 12345 } // optional
) ;钩子返回的值可以作为 props 传递到您的自定义组件或以您希望的任何方式使用。
async (query: string, summarize: boolean) => Promise<{ searchResults: DeserializedSearchResult[]; summary?: string }>这用于向搜索 API 发送消息。当搜索成功时，将返回一个由搜索结果数组和可选摘要组成的对象。每个搜索结果都是一个DeserializedSearchResult对象。有关类型的更多信息可以在此处找到。
boolean指示搜索请求是否仍待处理的布尔值
将 React-Search 与 SSR 框架结合使用可能需要额外的基础设施。以下是一些常见的问题：
React-Search 提供了与 Next.js 兼容的ReactSearchNext变体。它接受与ReactSearch相同的 props。
它可以导入为：
import { ReactSearchNext } from "@vectara/react-search/lib/ReactSearchNext" ;除了使用这个与 Next.js 兼容的组件之外，您还需要在导入ReactSearchNext的文件中使用"use client"指令。
React-Search 从您的 Vectara 语料库中提取数据。要进行此设置：
专业提示：创建 API 密钥后，导航到您的语料库并单击“访问控制”选项卡。在底部找到您的 API 密钥，然后选择“全部复制”选项来复制您的客户 ID、语料库 ID 和 API 密钥。这为您提供了配置<ReactSearch />实例所需的所有数据。
Vectara 使您能够定义文档的元数据。 React-Search 根据特定元数据字段的存在而表现不同：
title ：如果定义了此字段，它将呈现为搜索结果的标题。通常，这类似于文档或网页的标题。url ：如果定义了此字段，React-Search 会将搜索结果呈现为已定义 URL 的链接。 该代码库附带一个开发环境，以促进增强和错误修复。它允许维护人员快速迭代代码并立即验证更改。
从根目录运行：
npm install
这将安装构建组件和运行开发环境所需的所有依赖项。完成后，运行：
npm run docs
这会启动在http://localhost:8080/上运行的应用程序。您的最新更改将反映在这里。
开发环境运行后，对/src目录中的 .ts 和 .tsx 文件进行的任何更改都将触发组件的重建和网页的重新加载。
此外，对/docs/index.tsx中的开发应用程序源代码的任何更改也将触发重建 + 重新加载。
Vectara React-Search 是一款根据 Apache 2.0 许可证授权的开源软件。
该存储库包含示例代码，可以帮助您构建由 Vectara 提供支持的 UI，并根据 Apache 2.0 许可证获得许可。除非适用法律要求或书面同意，否则根据许可证分发的软件均按“原样”分发，不带任何明示或暗示的保证或条件。请参阅许可证，了解许可证下管理权限和限制的特定语言。
