1. 将设计好的 UI 划分为组件层级
2. 用 React 创建一个静态版本
确定了组件层级，可以编写对应的应用了。最容易的方式，是先用已有的数据模型渲染一个不包含交互功能的 U。最好将渲染 UI 和添加交互两个过程分开。
小型项目自上而下的编写方式更加方便；但是对于大型的项目来说，自下而上地构建，并同时为低层组件编写测试是更加简单的方式。
3. 确定 UI state 的最小（且完整展示）
通过问自己三个问题，逐个检查相应数据是否属于 state：
- 该数据是否是由父组件通过 props 传递而来的？如果是，那它应该不是 state;
- 该数据是否随时间的推移而保持不变？如果是，那它不是 state;
- 你能否根据其他 state 或 props 计算出该数据的值？如果是，那它也不是 state;
京公网安备 11010502036488号