React

前言 useBlocker 是 React Router 中用于阻止用户导航的钩子，它允许开发者在特定条件下（例如表单未保存时）拦截用户的导航行为（如点击链接、回退按钮等），并触发自定义逻辑（如显示确

一、前言 useLoaderData，用于在组件中获取路由预加载的数据。它通常与路由配置中的 loader 函数配合使用，用于在页面渲染前异步获取数据（如 API 请求），并将数据直接注入组件，从而简

一、useActionData前言 useActionData 是 React Router 提供的一个钩子函数，用于获取在路由的 action 函数中返回的数据。它通常与表单提交（通过 <Form>

useBeforeUnload 是 React Router 提供的一个自定义钩子，用于在用户尝试关闭页面、刷新页面或导航到外部网站时触发浏览器原生的确认提示。 它的核心用途是防止用户意外离开页面导致

React Router 中的 unstable_usePrompt 是一个用于在用户尝试离开当前页面时触发确认提示的自定义钩子，常用于防止用户误操作导致数据丢失（例如未保存的表单）。 一、unsta

前言 useRoutes 是 React Router v6 引入的一个钩子函数，允许通过 JavaScript 对象（而非传统的 JSX 语法）定义路由配置。这种方式更适合复杂路由结构，且代码更简洁

React Router 中的 useOutlet 是 v6 版本新增的 Hook，用于在父路由组件中访问当前嵌套的子路由元素。它提供了比 <Outlet> 组件更灵活的控制方式，适合需要根据子路由状

一、useParams 的基本用法 用途：用于在组件中获取当前 URL 的动态路由参数（如 /user/:id 中的 id）。 二、useParams 使用注意事项 1、参数未定义的可能性 如果 UR

前言 useNavigate 是 React Router v6 中引入的一个钩子函数，用于编程式导航。它替代了旧版本（v5及以下）中的 useHistory，提供了更简洁的 API 来实现页面跳转、

一、useLocation基础用法 作用：获取当前路由的 location 对象 返回对象结构： 二、useLocation核心使用场景 1、导航高亮（根据路径匹配） 2、useLocation获取查

一、useSearchParams 定义 基本用法 定义：用于返回当前 URL 的 URLSearchParams 的元组和用于更新它们的函数。设置 search params 会导致导航。 useS

一、4.X版本中核心 API 和用途 1. createStore(reducer, [preloadedState], [enhancer]) 用途: 创建 Redux Store（数据仓库） 参数

使用 Redux 实现购物车案例 由于 redux 5.0 已经将 createStore 废弃，我们需要先将 @reduxjs/toolkit 安装一下； 使用 vite 创建 React 项目时候

不使用 redux 实现 购物车案例 使用 React 自带的 useState 和 useEffect Hook 即可实现购物车 1、新增商品 使用 setList() 进数据状态更新 2、修改商品

1、Redux概述 Redux 是一个用于 JavaScript 状态容器，提供可以预测的状态管理 Redux 可以让我们的构建一致化的应用，运行于不同的环境，客户端、浏览器、服务器，并且易于测试；

接下来 开始Redux 全面详细的文档输出，主要基于一下几个方面，欢迎大家补充指正 一、Redux 基础概念 为什么需要 Redux？ 前端状态管理的挑战（组件间通信、状态共享） Redux 解决的问

一、StrictMode 的核心作用 React StrictMode 是 React 16.3 引入的开发辅助工具，通过主动触发特殊检查帮助开发者提前发现潜在问题。它像一位严格的代码审查员，在开发阶

一、为什么需要性能测试 在现代前端应用中，组件树的复杂度往往以指数级增长。一个简单的点击事件可能触发数十个组件的连锁渲染，而开发者却如同置身黑暗迷宫，难以准确找到性能瓶颈所在。React Profil

文章如果错误偏差，烦请及时批评指正 一、为什么要使用 <Fragment>？ 因为在 React 中，组件必须返回单个根元素。当我们尝试直接返回相邻的 JSX 元素时： 传统解决方案是使用 包裹，但这

若有错误，欢迎批评指正 概述 React 18 引入的 useDeferredValue 是优化渲染性能的重要工具，特别适用于处理高开销的更新（如实时搜索、大型列表渲染）。它通过延迟非紧急的 UI 更