诱人的 React 视频教程-基础篇

查漏补缺：别把 React 基础写成八股文

这份基础篇视频解决的是“只会照抄脚手架模板，但一脱离教程就写不出独立组件”的脱节问题。很多转岗或备考的人，简历上写着熟悉 React，真上手时却连父子组件怎么通信都理不清，甚至把 props 和 state 的使用场景搞混。这门课不讲任何花哨的架构演进，只针对函数与组件化开发的最底层逻辑进行查漏补缺。它适合已经掌握 HTML、CSS 和 ES6 基本语法，能看懂普通 JavaScript 代码，但急需把零散的 DOM 操作思维切换到数据驱动视图模式的学习者。如果你连普通函数的传参和 this 指向都晕头转向，建议先补 JS 基础再看本课，否则到了事件处理和双向数据绑定的环节会彻底卡壳。

核心缺口与配套练习的咬合方式

整个资料包的线索集中在组件化、数据流和生命周期三个核心缺口上。建议先看组件输出与 Props 传递这几块，把静态的 UI 切成多个独立组件，再用 Props 把数据从外层塞进去，体会单向数据流的初貌。接着重点啃 state 属性与事件处理，这是很多人的重灾区：要弄清楚数据状态到底存放在哪个层级，以及用户操作触发事件后如何更新 state。资料里的 React 如何更新 DOM 这一节别快进，它会帮你建立虚拟 DOM 的直觉，明白框架替你干了什么脏活。看完后不要干瞪眼，必须配合练习：找你以前用原生 JS 写过的待办事项或计数器，强行用本课的组件拆分方式重写一遍，严格用 Props 向下传递数据，用事件回调向父组件传值，把单向数据流的闭环跑通。

学完应能独立回答的验收问题

看完生命周期那一节并做完重写练习后，你应该能不查资料直接回答几个硬核问题：无状态组件和有状态组件在数据职责上的本质区别是什么？两个没有直接父子关系的平级组件之间，如何通过共同的父节点进行状态中转与通信？组件从挂载到卸载，生命周期函数的触发顺序是怎样的，实际业务中应该在哪个阶段发起异步请求、又在哪个阶段清理定时器？如果能答上来，说明你已经具备用 React 独立搭建小型交互页面的能力，能脱离死记硬背的模板，真正用组件化思维拆解需求了。如果答得磕磕巴巴，就回去把组件间传值和生命周期的片段重新拖进度条看一遍，别假装自己全懂了，把缺口彻底补上再往后走。