【全栈React】第18天: Flux 简介
处理客户端应用中的数据是一项复杂的任务。今天我们正在研究一种处理Facebook提出的复杂数据的方法,称为 Flux 体系结构。 随着应用变得越来越复杂,我们需要更好的数据处理方法。有了更多的数据,我们将有更多的记录。 我们的代码需要使用新功能处理更多的数据和应用状态。从异步服务器响应到本地生成的、不同步的数据,我们不仅要跟踪这些数据,还要将其与视图保持正常的联系。 认识到对数据管理的需求,facebook 团队发布了一种处理数据的模式,称为 Flux。 今天,我们将看一下Flux体系结构,它是什么以及它存在的原因。 什么是fluxFlux是一种用于管理数据如何通过React应用流动的模式。正如我们所看到的,使用React组件的首选方法是通过从一个父组件向它的子组件传递数据。Flux模式使此模型成为处理数据的默认方法。 在Flux方法中处理数据有三不同的角色:
Flux的主要思想是,有一个单一源 (Stores 储存),他们只能通过触发 actions 更新。这些操作负责调用派发器,Stores可以 订阅 更改并相应地更新自己的数据。 When a dispatch has been triggered,and the store updates,it will emit a change event which the views can rerender accordingly.当发送已触发,并且存储更新时,它将发出一个更改事件,视图可以据此 重新渲染。
这似乎没必要这么复杂,但结构使它难以置信地容易推理,我们的数据来自哪里,导致它的变化,如何改变,让我们跟踪特定的用户流,等等。 Flux 背后的关键理念是: 数据流向一个方向,并完全保存在Stores中。 实现虽然我们可以创建我们自己的flux实现,许多已经创建了一些梦幻般的库,我们可以挑选。
它可能是相当激烈的尝试为我们的应用选择 正确 选项。每个人因为不同的原因都有自己的特点,是伟大的。然而,在很大程度上,React社区已经集中在使用另一种称为Redux的flux工具。 ReduxRedux是一个小的库,它的设计灵感来自flux模式,但本身不是一个纯粹的flux实现。它提供了相同的一般原则,围绕如何更新我们的应用中的数据,但以略微不同的方式。 与Flux不同,Redux不使用派发器,而是使用纯函数来定义数据变异函数。它仍然使用Store(储存)和Action(动作),可以直接地被栓到React组件。 3 主要原则的Redux我们将牢记在我们的应用中实现Redux是:
Redux和Flux的一个大的区别是中间件的概念。Redux增加了中间件的想法,我们可以使用它来操作我们接收到的操作,无论是进入还是从我们的应用中。几天后我们再详细讨论。 在任何情况下,这是很多介绍的flux模式。明天,我们将实际开始移动我们的数据使用Redux。 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |