如何在 React 中实现类似服务的组件(AngularJS 中的概念)

IT技术 angularjs reactjs
2021-05-14 10:33:19

全部:

我对 AngularJS 的 React 很陌生。在 AngularJS 中,有服务依赖注入,它可以提供一个服务实例来做除 UI 操作之外的数据获取、处理等。我想知道如何在 React 组件中执行此操作(或实现该注入)?

谢谢

4个回答

我更喜欢在另一个文件中创建一个服务,该文件通过 module.exports 公开“公共”功能。

例如

module.exports = {
  foo: function(){ return bar; }
}

然后由组件使用

import myService from './routetoservice/myService'

迈克尔邓恩答案的延伸

这是实际的答案,

  • 服务模式不限于任何编程语言或库。

  • 我们可以在任何语言中实现这个概念,甚至我们可以在 react 中实现这个

  • 可以在服务器上或在 ui 浏览器中使用 Javascript 创建一个微小的服务,用于某些逻辑目的

  • 它为我们提供了代码可用性、代码管理、特定逻辑的代码隔离的好处

  • 它是代码可用性、代码管理、特定逻辑的代码隔离的一种非常原生的方式

  • 如果我们比较 redux/flux 与服务,redux/flux 也可以达到这些目的

  • 目前我正在使用 redux 及其操作,并在需要时在 ui 上创建了我的小服务。

  • 无需使用其他 NPM module来创建服务,只需Michael Dunn 的解决方案就足够了

在 reactjs 中,我们使用通量模式来提供数据处理。这是一个带有回流的例子。与 Flux react:这是教条模式还是有同等/更好的选择?.

React 似乎在哲学上反对 Angular 意义上的服务,显然更喜欢 UI 和逻辑的紧密耦合。

但是我发现了一个react-servicesmodule,它似乎提供了您所追求的:

• 通过引入负责在应用程序中传播更改的服务层来分离您的组件和应用程序状态

• 以显式、可测试的方式管理组件依赖项

• 没有事件和生命周期管理 - 一切都为您自动完成

• 小巧且易于理解 - 核心不到 100 行代码