问题标签 [reactjs-flux]

我正在尝试在我的一个项目中使用 Flux 架构。

我的一些操作具有需要满足的先决条件才能允许分派该操作。

目前，这个先决条件检查逻辑在我的视图代码中，像这样（伪代码）：

这对我来说看起来很尴尬，因为现在我的视图里面有业务逻辑代码。我很想把这个检查代码放到我的商店里，但我做不到。我有不止一个商店来处理这个动作，只有一个商店知道它是否有效。所以它不起作用：

我无法判断BarStore是否ButtonClickAction允许，除非我“ WaitFor(FooStore)”然后询问它，但这将导致处理此操作的每个商店都包含相同的检查，从而导致一些非常混乱的事情。

到目前为止，我了解到 Flux 中的 Action 只有在保证允许的情况下才会被调度，即在调度之前需要检查 Action 的有效性。这意味着这个验证需要在视图中？

上面按钮示例的解决方案可能很简单：“在不允许的时候隐藏按钮，它永远不会发生”。但是假设我有一个 Action 在用户点击空格键时被调度，我该怎么办？当不允许发生操作时，我无法从用户键盘上删除空格键。

PS 我没有使用 React，所以问题纯粹是关于 Flux 架构风格，我什至没有使用 JavaScript。

将一个大组件拆分为多个较小组件并聚合它们的数据的最佳方法是什么？我想在 FormComponent 中访问 BillingDataComponent、NameComponent 和 AddressComponent 的状态。

例子：

最近我发现了 Flux 架构，发现了这个，React starter kit。良好的结构，但是，应用程序需要为浏览器编译，从带有 gulp 的 node.js。

我正在使用reqwest对服务器进行 ajax 调用， reqwest 需要 window ，这在 node.js 上不可用。当我从 ES 6 编译（使用gulp-render）到 ES 5.1 时，react render 会评估所有require(..)文件并因为未定义窗口而给我错误，我该如何避免这种情况？你有没有处理过这样的事情？

我正在开发一个应用程序，我希望计时器从 60 秒倒计时到 0，然后更改一些内容，之后计时器在 60 处重新启动。

我已经在 React 和 Flux 中实现了这一点，但是由于我是新手，所以我仍然遇到了一些问题。

我现在想为计时器添加一个开始/停止按钮。我不确定在哪里放置/处理计时器状态。

我有一个Timer.jsx看起来像这样的组件：

它从商店中检索倒计时持续时间，我只是在这里：

var _timeLeft = 60;

现在，当我想实现一个开始/停止按钮时，我觉得我也应该通过 Flux Actions 来实现它，对吗？所以我想在我的商店里有这样的东西：

但是，由于我的 Timer 组件当前处理 setInterval，我不知道如何让我的 START/STOP_TIMER 事件正常工作。我是否应该将 setInterval 内容从 Timer 组件移到 Store 并以某种方式将其传递给我的组件？

完整的代码可以在这里找到。

我已经开始学习 Facebook 的 Flux 架构。我正在尝试制作一个简单的登录屏幕。我已按照通量聊天示例应用程序创建屏幕。我在 ServerActionCreator 和 WebAPIUtils 之间存在循环依赖问题。请看下面的代码。

ServerActionCreator.js

WebAPIUtils.js

如您所见，ServerActionCreator 依赖于 WebAPIUtils，而 WebAPIUtils 依赖于 ServerActionCreator。

我认为，由于循环依赖，WebAPIUtils 成为一个空对象，并且在调用 ServerActionCreator 中的 loginSubmit 函数时出现“未定义不是函数”错误。截图如下。

如何处理这种情况？或者有没有其他方法？任何帮助深表感谢。

在我的 Fluxxor 应用程序中的操作哈希中，我正在代理 ajax 调用来解析结果。我希望能够从该模块内分派响应有效负载。有人告诉我，我可以通过传入通量实例来做到这一点，然后我可以像这样调度：

我的 actions.js 文件：

我不确定如何将通量实例传递到 api 模块中，而不是将其传递到对每个感觉不正确的请求的“get”方法调用中。

如何将通量实例放入 api 模块？

更新：

我刚刚意识到我在 node_modules 中有通量库。我可以在我的 api 模块中只需要通量吗？

然后我可以访问 Dispatcher.dispatch.. 或者这是否违反了 Fluxxor 的精神？

我有一个商店，它的数据每秒增加 1。

我希望我的组件为一个矩形设置动画，随着数据的增加“水平填充”，基本上：

问题是我的商店没有通过这个“值”（0、0.2、0.5），而是每秒增加 1。

那是我的问题-> 存储数据不通过其间的值，因此，如果我的组件宽度接收数据，它显然只会在宽度上跳跃。

我正在考虑在渲染循环中设置状态，以便我可以手动减少状态变量。但是这是不可能的，因为我不能在渲染循环中调用 setState。

我应该如何在 ReactJS 中处理这个问题？使我的数据变为中间值（0.2、0.5...）似乎很糟糕，因为它更像是 UI 而非数据。

我最近开始使用 React.js 和 Flux 架构。作为一个相对较新的框架，我很难确定推荐的结构/命名/G 应用程序。

是否有任何 React/Flux 样板项目？生成器来启动一个新项目？

更新原来我的整个方法是错误的。正如公认的答案所暗示的，一个好的起点是使用 React + Flux 构建并托管在 GitHub 上的TodoMVC应用程序。

我正在构建一个非常小的 React + Flux 应用程序用于学习目的。目前它只包含登录表单和内容（实际上只是显示用户名）。我计划将应用程序组件作为我的应用程序中唯一的有状态组件，它将其状态作为道具发送给孩子。但是我不知道从孩子（在我的例子中是输入表单）更新应用程序状态的最佳实践是什么。我想我可能可以沿着层次结构将它冒泡，但这似乎是一种不好的做法。另外，我应该将登录的用户名保存在商店中吗？

这是我的意思的一个基本示例：

我在这里用这个例子设置了一个 JSFiddle，我的目标是用警报字符串替换 [username]。

我正在使用 pouchDB 作为应用程序的本地数据库。我想从 PouchDB 查询结果并将其加载到 React.js 中。但是，即使我使用 waitFor() 方法，PouchDB 查询的结果返回也太晚了。我想我不明白 waitFor() 的正确使用，也许有人可以解释一下。

我有两个商店，从数据库中检索数据的 DbStore。FileExplorerStore 这个商店被我的反应组件使用。

DbStore 有一个函数 LoadFiles，它将把 DB 文件加载到 _files 数组中。出于说明目的，我复制了以下代码：

FileExplorerStore 有一个从 _files 数组中检索文件的方法。然后在 FileExplorerStore 我有一个 getFiles() 方法，它将检索这些文件。但是，此数组始终为空，因为此方法将在数组填充之前执行。

文件浏览器商店

在 react.js 中，getInitialState 函数将从 FileExplorerStore 调用 getFiles() 函数来显示文件。

我该如何解决这个问题或以更好的方式对此进行建模？