react始终整体刷新整个页面（基本思想）
- 1个概念（组件方式描述ui）
- 4个必须api
- 单向数据流
- 完善的提示
react通过组件考虑UI
- props+state => view（组件展现形式由props属性 和 state状态一起决定）
- 1 React中组件本身不提供方法 而是某种状态机（一般状态是什么结果就是什么）
- 2 react可以理解为一个纯函数
- 3 单向数据流动（组件接收参数一定是通过props 要想看到组件状态 一定是view暴露了一个事件 外包监听这个状态看到组件变化。）
组件的两种类型
- 1受控组件（状态受到外部控制）
- 2非受控组件（不受外界控制状态由内部控制，不需要传props 和 state ）
组件的单一指责原则
- 1 每个组件只做一件事件
- 2拆分小组件，让组件尽量的小 功能尽量的简单。方便维护而且可以提高性能，因为一个大组件渲染的时候所有状态都需要渲染
数据状态管理DRY原则
1能计算得到的状态尽量别单独储存 2组件尽量无state状态 通过props获取
react中JSX是语法糖而不是模版引擎
语法糖的优点运行实质是通过js在创建节点的方式插入DOM，其他模版语言是通过解析器解析html内容 jsx本身也是表达式
ES6的延展属性
const porps ={ name:xx;age:15 } <Test { ...props } />
react生命周期
constructor
- 1用于初始化内部的状态 很少使用
- 2唯一可以直接修改state的地方 可以使用this.state.name = xxx
getDerivedStateFromProps
- 1当state 需要从props时初始化会用到（一般当用props初始化sate时候 这个状态一般都可以从props直接读到，这个state的状态不需要存储。）
- 2尽量不要使用 维护两者一致性会增加复杂度
- 3每次render 都会调用
- 4典型场景 form控件获取初始值
componentDidMount
- 1UI渲染完成后调用
- 2只执行一次
- 3典型场景获取外部资源 （操作dom节点 获取网络请求等）
getSnapshotBeforeUpdate
- 1在页面render之前调用 state已更新
- 2典型场景 获取render 之前的DOM状态
ComponentDidUpdate
- 1每次UI更新时候被调用
- 2典型场景 页面根据props重新获取数据 如详情页id变化 更新数据
shouldComponentUpdate
- 1决定虚拟DOM是否需要重拾
- 2一般可以由PureComponent自动实现
- 3典型场景 性能优化
