react

写 React 项目时，你是不是经常遇到这种崩溃瞬间：改了一行看似无关的代码，控制台突然报错 “Cannot read property 'name' of undefined”；传参时少写个属性，运

在 React 开发中，状态管理一直是个绕不开的话题。你是不是也经历过：用 useState 管理全局状态时，组件嵌套太深导致 props 层层传递（“props 钻取”）；用 Redux 又觉得样板

在 React 中，ref是个很实用的东西 —— 它能让我们直接访问 DOM 元素或组件实例，比如给输入框自动聚焦、获取元素尺寸等。但用着用着你会发现：类组件可以轻松接收ref，可函数组件却不行？每次

写 React 组件时，你有没有遇到过这种情况：明明只改了一个数字，却发现控制台里一堆组件在 “瞎渲染”—— 打印日志刷个不停，页面偶尔还卡顿？其实这不是组件 “不听话”，而是你没告诉它 “什么时候该

写 React 组件时，你肯定写过这样的代码：<div><h1>Hello JSX</h1></div>—— 这行 JSX 看起来像 HTML，却能和 JavaScript 一起运行。但你有没有想过：

面试时被问到 JSX，很多人会说：“就是在 JavaScript 里写 HTML 嘛！” 但如果面试官追问：“JSX 能直接在浏览器里运行吗？”“它和 HTML 到底有啥区别？” 不少人就卡壳了。其实

写 JSX 时，你一定见过这个警告：“Each child in a list should have a unique 'key' prop”。 很多人知道要加 key，却不明白为什么 —— 不就是

写 React 应用时，你是不是经常纠结：状态该放在哪个组件？深层子组件需要用某个状态，难道要一层一层传 props？遇到复杂状态（比如 Todo 列表的增删改查），用 useState 感觉力不从心

在React开发中，组件通信一直是核心话题。常见的通信方式有： 父子组件：通过props传递数据 👨‍👦 子父组件：通过回调函数通信 🔄 兄弟组件：通过父组件中转 📦 跨层级组件：使用Context或

在写 React 组件时，你是不是也遇到过这种情况：JSX 代码明明逻辑清晰，却非得在外层套一个多余的div？否则就会报错 “JSX 相邻的元素必须被包裹在一个闭合标签中”。而<></>的出现，就像给

你是不是也遇到过这样的场景：深层嵌套的组件需要共享状态，不得不一层一层传递 props，代码像 “传话筒” 一样繁琐？这种 “props drilling”（props 透传）不仅让代码冗余，还让维护

你是不是以为 React Router 只会配置path和element？其实，路由的进阶用法 —— 懒加载、权限守卫、状态码处理，才是决定单页应用（SPA）性能和安全性的关键。为什么别人的 Reac

在学习react的过程中，“如何在不同页面之间跳转” 是绕不开的问题。react-router-dom作为 React 生态中处理前端路由的核心库，能帮我们轻松实现页面导航。 什么是路由？从前后端路由

为什么你的React组件总在闪烁？为什么元素位置计算总是不准确？答案就藏在useLayoutEffect中！在此前已经学习过了useEffect，二者又有什么不同呢？ useEffect 与 useL

在 React 函数组件中，useEffect是处理 “副作用” 的核心工具。无论是数据请求、定时器管理，还是 DOM 操作，都离不开它。 先搞懂：什么是 “副作用”？ 在 React 中，“副作用”

React 的事件处理看起来和原生 JS 很像（比如都有onClick），但深入用起来会发现不少差异：为什么打印的事件对象是SyntheticEvent？为什么定时器里访问事件属性会失效？这些问题的根

useState 是 React 函数组件中最基础也最常用的 Hook，看似简单，实则藏着不少影响代码质量的细节。很多人能用它实现基本功能，却在 “状态更新时机”“不可变性处理” 这些点上踩坑，导致组

“在 JS 里写 HTML？这是什么操作？” 别慌！今天从最基础的 JSX 语法讲到 React 组件开发，用 “HTML+JS” 的混合思维带你入门，看完就能写出第一个 React 组件～ 🔍

一、前端开发演进：从切图崽到全干工程师的成长路径 在开始React业务开发之前，让我们先了解前端工程师的成长路线： 前端切图崽：掌握HTML+CSS+基础JS，能实现静态页面 前端开发工程师：掌握Vu