草庐IT

javascript - 从AngularJS到Flux- react 方式

coder 2023-07-05 原文

作为拥有丰富的AngularJS经验的开发人员,如何调整使用React使用Flux编写Web应用程序的思维模式?

我不是在寻找Flux + React vs Angular的答案(已经在网上找到了很多答案),但是我想知道两个“心态”之间最大的区别是什么?比较而言,什么是 react 方式?

当我离开Angular宇宙并过渡到Flux时,我需要从开始关注关键事项是什么?

首先是区别,现在是相似之处:AngularJS非常自以为是,并且有很多很大的禁忌,例如-不要将UI/DOM代码放入 Controller 中。 React的最大禁忌是什么?

最后但并非最不重要的一点是,Facebook将Flux替换为MVC,但正如我所看到的那样-React是 View 引擎,存储是专注于单个域的模型容器,而调度程序和操作则构成了 Controller 。那么,这实际上不是MVC的另一个名称吗?

最佳答案

我将让其他人与Angular进行比较/对比,但这是对您的两个问题的一些答案。

So isn't this actually MVC with a different name?



在Flux中,数据/逻辑层和 View 层之间存在关注点分离并不能使其成为MVC。许多其他模式也有类似的 split ,最明显的是CQRS,可以说是Flux最接近的表亲。从MVC的 Angular 来看,Flux中没有 Controller 。 Action 和调度程序不等于 Controller 。 Controller View 很接近,但实际上在其类似 Controller 的方面受到很大限制。一个关键的区别是MVC Controller 包含应用程序逻辑并根据模型起作用。相比之下,助焊剂存储区包含所有应用程序逻辑,并且没有 setter 。

As I leave the Angular universe and transition to Flux, what are the key things I need to start paying attention to?



通量的关键值:
  • 简单而不是复杂。
  • 程序员的思维模型至少与代码本身同样重要。
  • 应高度分离应用程序的各个部分,并尽可能少地“了解”其他部分。
  • 控制反转:所有控制都应位于状态被管理的商店中。商店不采取行动,而是采取行动。
  • 应用程序在增长时应保持弹性和灵活性,以允许更快,更轻松地开发新的意外功能。

  • Flux中的关键概念:
  • 单向数据流:操作→调度程序→存储→ View
  • 状态的所有更改和所有新数据均以调度的Action开始。
  • 这四个步骤的数据流是Flux程序员的核心思维模型。
  • 调度将导致应用程序范围内的应用程序状态转换。
  • 这是一个时刻,用于创建更改快照。这很容易推断。
  • 我们无法在分派(dispatch)时分派(dispatch)并保持这种简单性。因此,任何必然的变化都必须由原始行动来驱动。
  • Flux商店是域模型,而不是ORM模型。它们包含所有逻辑并管理应用程序中特定逻辑域的所有状态。它们可以包含集合,奇异值或两者的组合。
  • Flux假定派生数据(一个商店依赖于另一商店的更改)是模型或商店管理归一化数据的复杂应用程序中的最终结果。为了解决这个问题,Flux Dispatcher应该公开一种机制,以声明方式管理商店内的这种依赖关系。在Facebook的Dispatcher中,这是通过waitFor()方法完成的。这样一来,一家商店就可以等待另一家商店对某项操作的响应,然后再继续自己的响应。

  • Flux应用程序的主要部分:
  • 操作:包含新数据和特定类型的对象常量,
    允许商店辨别是否与他们的领域有关。
  • 调度程序:回调的注册表,通过回调,
    向注册人(商店)分发有效负载(操作)。它没有自己的智能。所有情报都在商店中。
  • 存储:一个域模型,该模型在Dispatcher中注册自己,并在状态发生变化时发出“change”事件。
  • Controller View :查看组件树根附近的组件。他们侦听商店中的“更改”事件,并通过商店的公开getter方法检索新数据并将其传递给 child 来对此事件做出响应。 Controller-views和Views之间的唯一区别是此侦听功能。
  • View : Controller View 组件的无状态子级,接收和传递数据,就像纯函数一样。 View 和 Controller View 通常是用React实现的,因为它提供了随意重新渲染的功能,而性能损失很小。
  • 实用程序:可以在不同模块之间轻松共享的纯函数库。

  • 概述,深入了解:http://facebook.github.io/flux/docs/overview.html

    教程:http://facebook.github.io/flux/docs/todo-list.html

    示例:https://github.com/facebook/flux/tree/master/examples

    Action 与调度程序:http://facebook.github.io/react/blog/2014/07/30/flux-actions-and-the-dispatcher.html

    测试:http://facebook.github.io/react/blog/2014/09/24/testing-flux-applications.html

    更多信息:http://facebook.github.io/react/blog/2014/10/17/community-roundup-23.html

    关于javascript - 从AngularJS到Flux- react 方式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27264487/

    有关javascript - 从AngularJS到Flux- react 方式的更多相关文章

    1. ruby - 如何以所有可能的方式将字符串拆分为长度最多为 3 的连续子字符串? - 2

      我试图获取一个长度在1到10之间的字符串,并输出将字符串分解为大小为1、2或3的连续子字符串的所有可能方式。例如:输入:123456将整数分割成单个字符,然后继续查找组合。该代码将返回以下所有数组。[1,2,3,4,5,6][12,3,4,5,6][1,23,4,5,6][1,2,34,5,6][1,2,3,45,6][1,2,3,4,56][12,34,5,6][12,3,45,6][12,3,4,56][1,23,45,6][1,2,34,56][1,23,4,56][12,34,56][123,4,5,6][1,234,5,6][1,2,345,6][1,2,3,456][123

    2. ruby - 解析 RDFa、微数据等的最佳方式是什么,使用统一的模式/词汇(例如 schema.org)存储和显示信息 - 2

      我主要使用Ruby来执行此操作,但到目前为止我的攻击计划如下:使用gemsrdf、rdf-rdfa和rdf-microdata或mida来解析给定任何URI的数据。我认为最好映射到像schema.org这样的统一模式,例如使用这个yaml文件,它试图描述数据词汇表和opengraph到schema.org之间的转换:#SchemaXtoschema.orgconversion#data-vocabularyDV:name:namestreet-address:streetAddressregion:addressRegionlocality:addressLocalityphoto:i

    3. ruby-on-rails - 正确的 Rails 2.1 做事方式 - 2

      question的一些答案关于redirect_to让我想到了其他一些问题。基本上,我正在使用Rails2.1编写博客应用程序。我一直在尝试自己完成大部分工作(因为我对Rails有所了解),但在需要时会引用Internet上的教程和引用资料。我设法让一个简单的博客正常运行,然后我尝试添加评论。靠我自己,我设法让它进入了可以从script/console添加评论的阶段,但我无法让表单正常工作。我遵循的其中一个教程建议在帖子Controller中创建一个“评论”操作,以添加评论。我的问题是:这是“标准”方式吗?我的另一个问题的答案之一似乎暗示应该有一个CommentsController参

    4. 【鸿蒙应用开发系列】- 获取系统设备信息以及版本API兼容调用方式 - 2

      在应用开发中,有时候我们需要获取系统的设备信息,用于数据上报和行为分析。那在鸿蒙系统中,我们应该怎么去获取设备的系统信息呢,比如说获取手机的系统版本号、手机的制造商、手机型号等数据。1、获取方式这里分为两种情况,一种是设备信息的获取,一种是系统信息的获取。1.1、获取设备信息获取设备信息,鸿蒙的SDK包为我们提供了DeviceInfo类,通过该类的一些静态方法,可以获取设备信息,DeviceInfo类的包路径为:ohos.system.DeviceInfo.具体的方法如下:ModifierandTypeMethodDescriptionstatic StringgetAbiList​()Obt

    5. ruby - 鸭子输入字符串、符号和数组的优雅方式? - 2

      这是针对我无法破坏的现有公共(public)API,但我确实希望对其进行扩展。目前,该方法采用字符串或符号或任何其他在作为第一个参数传递给send时有意义的内容我想添加发送字符串、符号等列表的功能。我可以只使用is_a吗?数组,但还有其他发送列表的方法,这不是很像ruby​​。我将调用列表中的map,所以第一个倾向是使用respond_to?:map。但是字符串也会响应:map,所以这行不通。 最佳答案 如何将它们全部视为数组?String的行为与仅包含String的Array相同:deffoo(obj,arg)[*arg].eac

    6. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法? - 2

      我遇到了一个非常奇怪的问题,我很难解决。在我看来,我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时,我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性,其中包括href和data-method。再次单击此链接后,我的服务器收到了对新href的请求,但使用的是旧的data-method,即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是,如果我刷新页面,HTML与"new"HTML相同(随返回的JS发生变化),但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

    7. ruby - 如何以编程方式删除实例上的 "singleton information"以使其编码(marshal)? - 2

      我创建了一个由于“在运行时执行的单例元类定义”而无法编码的对象(这段代码的描述是否正确?)。这是通过以下代码执行的:#defineclassXthatmyusesingletonclassmetaprogrammingfeatures#throughcallofmethod:break_marshalling!classXdefbreak_marshalling!meta_class=class我该怎么做才能使对象编码正确?是否可以从对象instance_of_x的classX中“移除”单例组件?我真的需要一个建议,因为我们的一些对象需要通过Marshal.dump序列化机制进行缓存。

    8. ruby - Paperclip:以编程方式分配图像并设置其名称 - 2

      使用Paperclip,我想从这样的URL抓取图像:require'open-uri'user.photo=open(url)问题是我最后得到一个像“open-uri20110915-4852-1o7k5uw”这样的文件名。有什么方法可以更改user.photo上的文件名?作为一个额外的变化,Paperclip将我的文件存储在S3上,所以如果我可以在初始分配中设置我想要的文件名就更好了,这样图像就会上传到正确的S3key。像这样:user.photo=open(url),:filename=>URI.parse(url).path 最佳答案

    9. ruby - 如何以编程方式检查证书是否已被吊销? - 2

      我正在开发一个xcode自动构建系统。在执行一些预构建验证时,我想检查指定的证书文件是否已被撤销。我了解securityverify-cert验证其他证书属性但不验证吊销。我如何检查撤销?我正在用Ruby编写构建系统,但我对任何语言的想法都持开放态度。我阅读了这个答案(Openssl-Howtocheckifacertificateisrevokedornot),但指向底部的链接(DoesOpenSSLautomaticallyhandleCRLs(CertificateRevocationLists)now?)进入的Material对我的目的来说有点过于复杂(用户上传已撤销的证书是一

    10. ruby-on-rails - Ruby 长时间运行的进程对队列事件使用react - 2

      我有一个将某些事件写入队列的Rails3应用。现在我想在服务器上创建一个服务,每x秒轮询一次队列,并按计划执行其他任务。除了创建ruby​​脚本并通过cron作业运行它之外,还有其他稳定的替代方案吗? 最佳答案 尽管启动基于Rails的持久任务是一种选择,但您可能希望查看更有序的系统,例如delayed_job或Starling管理您的工作量。我建议不要在cron中运行某些东西,因为启动整个Rails堆栈的开销可能很大。每隔几秒运行一次它是不切实际的,因为Rails上的启动时间通常为5-15秒,具体取决于您的硬件。不过,每天这样做几

    随机推荐