【译】解构ReactJS的Flux
用ReactJS时不要使用MVC
我将通过列出一些单向数据流的例子来将ReactJS官方实现的Flux和我写的库Reflux作比较。
Facebook的ReactJS开发小组似乎并不待见MVC框架。将MVC模式和ReactJS结合使用了一段时间后,我似乎发现了争议从何而来了。你会遇到一个问题:你应该如何处理数据?ReactJS并不在乎太多关于数据是如何传入的或者贯穿整个Web应用去处理数据。这个几乎是一个架构层面的问题,并不是ReactJS所能涵盖的。于是Facebook中的优秀开发者提出了一个函数式的方法,他们称其为:Flux。
Flux的基本思想是可以在Web应用中拥有一个更加函数式的方法来处理数据。Flux介绍了Actions和Data Stores的概念来处理整个应用的事件和数据。数据流大致是这个样子的:
1 | Action -> Data Store -> Component |
数据的突变必须是在调用Actions时发生的,Data Stores需要监听actions并且改变store中的数据。这让数据结构保持扁平,并让数据的改变操作始终发生在Stores中,这防止了让Components自己处理数据所带来的副作用。
通过使用单向数据流,跟踪数据的改变将更加容易,因为它完全依赖于actions是如何发布的,继而影响整个应用。Components自身仅通过执行调用action来改变应用数据,这样避免了维护上的麻烦。