React基础与实践
-
- React特性与简介
React：用于构建用户界面的JavaScript库
特点：声明式，组件化，跨平台编写
React是用JS构建快速响应的大型Web应用程序的首选方式之一【等待资源加载时间和大部分情况下浏览器单线程执行式影响wed性能的两大主要原因】
Lazy&Suspense；ErrorBoundary；更新流程【调度器，协调器，渲染器】
优点：快速响应：Fiber；组合化：复用性强；声明式编程 ；跨平台：只需修改渲染器。缺点：大型应用需要配套学习状态管理，路由工具；不适合小型应用，需要babel处理
-
- 基础温故知新
用React开发web应用：【架构】打包配套：JSX，babel，JS加载优化和错误降级；【路由】React Router向应用中快速的添加视图和数据流，保持页面与URL间的同步；【ui】可复用ui，组件，页面，可复用逻辑抽离成hook；【状态】多页面多组件共享信息，redux&context。
组件：【数据】通过定义state操作视图Mount时获取数据更新state，Ref保存于仕途无直接关系的值，unMount前清空Ref；【ui】数据决定视图。通过Ref获取到DOM；【通信】props父子组件通信，context&redux组件信息共享；【性能】函数使用useCallback，值或者计算使用useMemo；组件包裹memo
组件：
【Class组件】继承+构造函数，this，生命周期，render方法；
【函数式组件】没有生命周期，借助Hook，returnJSX；
比较：函数式相较于class的优点：代码量骤减，组件干净清爽，没有复杂的生命周期，支持自定义hook，逻辑复用方便
Hook规则&原理：
只能在最顶层使用Hook；只能在React函数调用Hook。
及介绍了Hook过期闭包问题和React常见API及作用
划分组件：【layout】Navbar；Main content；Footer；Floating Button
【Page】Banner；CardGroup；Slider Group；Help Docs；Footer Banner
【Component】BlockHeader；SlideButton；AnimationWrapper；BlockWrapper；SizeText；
及介绍了父子组件通信，组件间共享信息；组件性能优化，组件挂载位置，逻辑复用的使用相关的案例，全面介绍了React方面案例
