UI = Component(props, state)
React 的核心思想是组件化的思想，所有的页面会被切分成一些独立的、可复用的组件。
那么数据从何而来呢？React 的数据是自顶向下单向流动的，即从父组件到子组件中，组件的数据存储在 props 和 state 中。
props 是组件对外的接口，state 是组件对内的接口。 组件内可以引用其他组件，组件之间的引用形成了一个树状结构（组件树），如果下层组件需要使用上层组件的数据或方法，上层组件就可以通过下层组件的 props 属性进行传递，因此 props 是组件对外的接口。组件除了使用上层组件传递的数据外，自身也可能需要维护管理数据，这就是组件对内的接口 state。根据对外接口 props 和对内接口 state，组件计算出对应界面的UI。
- props：
- props 是组件对外的接口，是一个对象，包含了所有通过父组件传递过来的数据，一般由父组件传递给子组件，子组件通过 props 对象获取父组件传递过来的数据。
- props 是只读的，不允许子组件修改父组件传递过来的 props 数据。
- props 是单向数据流，父组件的更新会向下传递到子组件中，但是子组件的更新不会影响父组件，也不会影响其他子组件，每个组件都是独立的。
- state：
- state 是组件对内的接口，是一个对象，包含了组件内部的状态和数据。
- state 是可变的，可以通过 this.setState 方法修改 state 数据，组件每次更新都会重新渲染 render。
- 修改state后，刷新UI是异步的，React 会将多个 setState() 调用合并成一个调用，只渲染一次组件，提高性能。Flutter的setState类似
- 只能在 constructor 中初始化，它是组件的私有属性，不可通过外部访问和修改，只能通过组件内部的 this.setState 来修改