tanstack-router

TanStack Router 是一个基于文件的路由方案，本资料围绕其路由组织与用法展开。用途：定义页面路由、动态参数、搜索参数、导航、数据加载、鉴权守卫、布局与嵌套路由及重定向。主要能力：基于 routes/ 目录的约定式文件路由，如 __root.tsx 根布局、index.tsx 首页、_app 布局与子路由、posts/$id.tsx 动态段、api/auth/$.tsx 捕获全部；用 createFileRoute 定义组件、loader、validateSearch、errorComponent、pendingComponent；支持 createRootRouteWithContext 与查询客户端上下文；beforeLoad 中可读取会话并在未登录时 throw redirect 到 /login；Link 与 useNavigate 提供声明式和编程式导航，支持 params、search 及相对路径；搜索参数可配合 zodValidator 与 stripSearchParams 管理默认值与 URL 状态；布局通过 Outlet 渲染子路由；loader 可结合 TanStack Query 的 ensureQueryData 预取数据。适用场景：需要类型安全、搜索参数驱动的列表、嵌套布局与路由鉴权的 React 应用。使用方式：按文件约定创建路由文件，在路由中配置 loader、validateSearch、beforeLoad，并在组件内用 Route.useLoaderData、Route.useSearch、Route.useParams 取数据。限制与注意：动态路由需 $ 前缀，validateSearch 要搭配适配器如 zodValidator，鉴权应放在 beforeLoad 而非组件，布局必须包含 Outlet，ensureQueryData 需 await，navigate 应使用类型安全路径，加载器内缺失数据用 throw notFound()。具体安装命令、版本与其余依赖资料中暂未提供。