如何将应用程序设置传递给存储

Question

就干净的 React 应用程序设计而言，我确定如何将应用程序设置传递给不属于组件树的模块。

例如我连接到 REST API，因此需要将主机名传播到组件，还要传播到商店 - 我正在使用 Reflux。

可以通过上下文轻松实现将设置传递给组件，但由于商店不是其中的一部分，最干净的方法是什么？

到目前为止，我考虑了这些方法：

将设置从组件传递到操作，然后我在每个商店侦听器上接收它。
使用一些在我的 index.js 中初始化并且可以在我的商店中使用的 DI 容器

两者似乎都不适合我。任何提示表示赞赏！

Answer 1

在大多数情况下，您不应保留应用程序设置。

您应该将您的应用程序想象成某种接收状态作为参数和 returns 视图的函数。应用程序状态的变化（通常）会导致结果视图发生变化。 Flux 存储是您保持这种状态的方式。 API 主机名不是您希望影响您的应用程序的东西。它只是一个信息负载，您的应用程序需要知道它才能正常工作（比如配置，而不是设置）。因此，您应该将其保留为信息负载。模块、class、全局变量、某种 DI，你可以考虑任何你觉得有用的东西。

我通常使用所有配置创建单独的模块导出对象。类似于：

const config = {
  api: {
    hostname: 'localhost',
    port: 3000
  }
  // ...
};

export default config;

然后只是导入它。类似于：

import config from "../config";

const api = new API(config.api); // just for example

但如果您确实需要使用某种可能会影响 UI 的设置（例如延迟显示弹出窗口；如果我们考虑根据用户的操作更改此延迟，这个示例会更好) 你应该创建 Settings store 并像使用常规 flux store 一样使用它（订阅更改，更改操作等）。

如何将应用程序设置传递给存储

How to pass application settings to store

reactjs

refluxjs