react-native基础入门视频教程

先认清你的能力缺口在哪

如果你写过 React 但没碰过移动端，或者一直用 H5 套壳应付 App 需求，那面对原生环境配置、多端导航、列表性能优化时大概率会卡壳。这门课要补的就是从零搭起一个能跑在真机上的 React Native 项目，而不是停留在浏览器里看组件渲染。它默认你已经有 React 基础，懂 props、state、hooks 这些概念，不负责教 JavaScript 语法。缺的不是前端框架逻辑，而是怎么把 React 那套思维搬到移动端：怎么处理 iOS 和 Android 环境差异、怎么用导航库管理页面栈、怎么用原生提供的列表组件避免长列表卡顿。如果你连 JSX 都写不顺，建议先补 React 基础再来看，否则到导航和多端联调环节会跟不上节奏。

建议先看哪几块以及怎么配合练习

资料包按环境、基础、导航、列表四大块组织，建议按这个顺序推进，不要跳着看。第一块环境搭配必须自己动手跑一遍，配好 Android 模拟器和 iOS 模拟器（或真机调试），只看不练后面全卡在报错上。第二块基础和第三块 React Navigation 是核心，导航部分占了很大篇幅，因为移动端页面栈管理比 Web 端复杂得多，涉及 Stack、Tab、抽屉等多种导航器嵌套，这部分要边看边写 demo，自己实现一个带底部 Tab 加二级页面的骨架。第四块列表和滚动视图是实战重点，FlatList 和 ScrollView 的使用不能停留在能渲染出来，要动手做轮播图和图文列表练习，体会两者在性能上的差异：ScrollView 会一次性渲染所有子节点，FlatList 才是长列表的正确解法。配套练习建议直接拿课程里的轮播图、图文消息列表、图片预览组件当作业，看完一节就照着实现一遍，再自己改参数看效果，别只跟着视频敲一遍就完事。

学完能独立做什么以及该问自己什么

学完这套内容，你应该能独立搭建一个带完整导航结构的移动端 App 骨架，能用 FlatList 实现性能过得去的长列表，能用 Modal 和 ScrollView 组合出图片预览这类常见交互。这意味着你可以接手一个常规的 React Native 业务模块开发，不至于在环境配置和基础组件上反复踩坑。看完后问自己几个问题：FlatList 相比 ScrollView 在什么场景下必须用，为什么？React Navigation 里页面栈怎么管理，怎么传参和回传？Modal 嵌套 ScrollView 时手势冲突怎么处理？如果这些都能答清楚，说明基础这块补到位了；如果答不上来，回头把对应章节再看一遍，别假装都会。