数据流向 Link to heading

React是单向数据流,从父节点传递到子节点(通过props)。如果顶层的某个props改变了,React会重渲染所有的子节点(未做性能优化)。严格意义上React只提供,也强烈建议使用这种数据交流方式

数据既然只能从父传到子, 那么像以下的情景: 点击 button 改变状态是怎么实现的呢?

答案是: callback function

组件沟通 Link to heading

最常见的是先 父组件更新状态然后子组件更新状态. 通过 **props** 传递给子组件来实现

还有一种情况就是 子组件更新状态然后父组件更新状态. 这种情况通过父组件 传递 callback 给子组件, 子组件触发即可.

还有一种是兄弟组件沟通, 可以通过 props 传递(通过 callback 实现)给父组件, 然后改变兄弟的状态.

全局事件 Link to heading

全局事件可以进行组件间的通讯, 官网推荐 Flux. Flux 是一种思想或者说模式, 就如同 MVC 和 MVVM 一样. 那么和 React 配对的就是 Redux. 我们一会再说.

Flux Link to heading

Flux 的核心思想就是 数据和逻辑永远单向流动

flux

react-redux 就是 flux 模式的一个实现. 我另外开辟帖子来说.

credit to Link to heading