这是我参与「第五届青训营 」伴学笔记创作活动的第 5 天
React 的历史与应用
本节课对 react 的历史进行了简单的介绍
React 历史
2010年，Facebook 在其 php 生态中，引入了 xhp 框架，首次引入了组合式组件的思想，启发了后来的 React 的设计
2011年，Jordan Walke 创造了 FaxJS，也就是后来的React 原型：
2012年，在Facebook收购Instagram后，该FaxJS项目在内部得到使用，Jordan Walke 基于FaxJS的经验，创造了React
2013年，React正式开源，在2013 JSConf 上Jordan Walke 介绍了这款全新的框架
React 的设计思路
UI 编程的痛点
用原生的 JavaScript 编程的时候会有几个痛点：
- 状态更新，UI 不会自动更新，需手动地调用 DOM 进行更新
- 欠缺基本地代码层面地封装和隔离，未组件化
- UI 之间的数据依赖关系，需要手动维护，如果依赖链路过长，会遇到 “Callback Hell”
解决思路
响应式编程：
- UI跟随状态更新
- 代码组件化，可复用，可封装
- 状态之间的相互依赖关系，只需声明即可
组件化：
- 组件声明状态和UI映射
- 组件有Props（外部提供复用性） / State（内部状态） 两种状态
- 组件可以由组件拼装
组件是
组件的组合/原子组件（组件可由其他组件拼装而成） 组件拥有内状态，外部不可见 父组件可将状态传入组件内部
状态归属问题:
-
React 单向数据流？双向数据流？
- 单向，只能父组件传子组件
生命周期
挂载
- constructor
- getDerivedStateFromProps
- render
- componentDidMount
更新
- getDerivedStateFromProps
- shouldComponentUpdate
- render
- getSnapshotBeforeUpdate
- componentDidUpdate
卸载
- componentWillUnmount
