React 只关注应用的视图层,不强制规定数据模型层。然而,在 React 应用中,通常将数据源称为商店 (stores)。商店有许多使用方式,但大多数都采用某种形式的订阅模型,即组件向商店注册,表明它们对商店的全部或部分数据感兴趣。当商店中的数据发生变化时,它会通知所有已表达对该变化感兴趣的组件。然后,组件可以相应地更新其内部状态,如果合适,则会触发重新渲染。
一种流行的商店和商店更新模型被称为 Flux。它由 Facebook 工程师设计,用于与 React 配合使用。网上有几篇关于 Flux 的优秀教程。此处是我们推荐的一篇。值得注意的是,Flux 是一种编程模式——一套原则,而不是一个框架或 API 集合。您可以选择采用全部或部分 Flux 原则。
Skype 团队最初采用了 Flux 原则,但我们发现它很笨重。它需要引入大量新类(调度器、动作创建器和调度事件),并且程序流程变得难以追踪和调试。随着时间的推移,我们放弃了 Flux,并为商店创建了一个更简单的模型。它利用 TypeScript 中的新语言特性(注解)来自动创建组件和商店之间的订阅。这消除了订阅和取消订阅中涉及的大部分代码。这种模式,我们称之为 ReSub,独立于 ReactXP,但它们配合得很好。