SuperAPI AI 工具集

search-params

前端与建站

查看项目

更新于 10-15 23:41

技能介绍

用途:在 TanStack Router 中把 search params 作为 JSON 优先的应用状态管理,URL 参数会自动解析为结构化对象(数字、布尔、数组、嵌套对象),并在每个路由通过 validateSearch 校验。

主要能力:支持 Zod、Valibot、ArkType 适配器;提供 fallback() 处理默认值;搜索中间件 retainSearchParams(跨导航保留参数)与 stripSearchParams(从 URL 移除默认值),可链式组合;支持自定义序列化(parseSearchWith / stringifySearchWith);父路由参数自动合并到子路由;类型完全推断。

使用方式:安装 npm install zod @tanstack/zod-adapter;在路由中定义 schema 并传给 validateSearch;读取用 Route.useSearch()、getRouteApi()、useSearch({ from }) 或 useSearch({ strict: false });写入用 Link 的函数形式(保留现有参数)或对象形式(替换全部参数),也可用 useNavigate();loader 中通过 loaderDeps 只选取所需参数。

限制与注意:Zod v3 配合 zodValidator() 时必须使用 @tanstack/zod-adapter 的 fallback(),不能用 .catch(),否则输出类型变为 unknown;Zod v4 则应使用 .catch() 且不用 zodValidator()。不要为 useSearch() 返回值添加类型标注。loaderDeps 不要返回整个 search 对象,否则任何参数变化都会重跑 loader。search params 中不要传 Date 对象,应转为 ISO 字符串。父路由缺少 validateSearch 会阻断子路由继承。Link 的 search 用对象形式会替换全部参数,需保留时用函数形式。