react-router
React官方推荐的多策略路由库，适用于Web应用开发。
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：react-router。 它的用途是：React官方推荐的多策略路由库，适用于Web应用开发。 完整的 Skill 内容见：https://321skill.com/skills/react-router/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
“我正在用React开发一个博客网站，需要实现文章列表页和详情页的路由，详情页URL要包含文章ID。”，AI会指导你安装`react-router-dom`包，并展示如何使用`<BrowserRouter>`、`<Routes>`和`<Route path="/article/:id">`来配置路由，以及如何在详情页组件中使用`useParams`钩子获取文章ID。
介绍
React Router是React生态中官方推荐的路由解决方案，它解决了在单页面应用（SPA）中管理不同视图、页面状态和URL同步的核心问题。通过声明式的路由配置，开发者可以轻松定义页面间的导航关系，并实现动态路由、嵌套路由、懒加载等复杂功能，确保UI与URL始终保持一致。
它的使用方式非常灵活，既可以作为完整的应用框架来构建项目，也可以作为轻量级库集成到现有的React架构中。开发者通过安装核心包，并使用<BrowserRouter>、<Routes>、<Route>等组件来定义路由结构，再结合useNavigate、useParams等Hook进行编程式导航和参数获取。
这个库非常适合所有使用React构建Web应用的前端开发者，无论是刚入门的新手需要快速搭建路由，还是资深开发者构建需要复杂路由逻辑（如权限控制、数据预加载）的大型企业级应用。
与同类路由库（如Reach Router，现已合并）相比，React Router是React团队深度参与和维护的“嫡系”方案，拥有最广泛的社区采用度和最完善的生态系统。其设计哲学强调与React的深度集成和声明式API，提供了从服务端渲染（SSR）到静态站点生成（SSG）的全栈路由支持，并通过一系列官方适配包（如@react-router/express）无缝对接不同的部署环境。
核心特点
作为React生态的“官方”路由方案，它提供了最全面、最稳定的API，并深度集成了数据加载、表单处理等现代Web应用特性，其多环境适配包（Node、Express、Cloudflare等）是区别于其他纯客户端路由库的核心优势。
注意事项
主要专注于Web应用的路由，对于React Native等移动端场景，需要使用专门的`react-router-native`包。
常见问题
React Router 最新版本是哪个？如何从老版本升级？
目前主版本是v7，官方提供了详细的升级指南（https://reactrouter.com/upgrading/v7），建议按步骤迁移。
React Router 和 Next.js 的路由有什么区别？
React Router是一个客户端路由库，通常用于SPA；Next.js是一个全栈框架，其基于文件系统的路由默认支持服务端渲染和静态生成，两者定位不同。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/react-router/raw/index.md 读取 react-router 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/react-router/raw/index.md（查看排版版本）