Question

我试图将Flux架构用于我的一个项目中。

我的某些操作具有必须满足的先决条件，以便允许调度该操作。

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

class FooView {
    void OnButtonClick() {
        if (FooStore.IsButtonClickAllowed) {
            Dispatch(ButtonClickAction);
        }
    }
}

这看起来很尴尬，因为现在我的View里面有业务逻辑代码。我想把这个检查代码放到我的商店，但我不能。我有多个商店处理这个行动，只有一个商店知道它是否有效。所以它不会工作：

class FooStore {
    void Handle(Action) {
        if (Action is ButtonClickAction) {
            if (IsButtonClickAllowed) {
                FooData.Something();
            } else {
                // Ignore
            }
        }
    }
}

class BarStore {
    void Handle(Action) {
        if (Action is ButtonClickAction) {
            BarData.Something();
        }
    }
}

除非{＆＃34; BarStore＆＃34;然后问它，但这会导致处理此Action的每个Store都包含相同的检查，导致一些非常混乱。

到目前为止，我理解只有在保证允许的情况下才会发送Flux中的Action，即需要在它之前检查Action的有效性＆ ＃39;被派遣。这意味着此验证需要在View？

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

P.S。我没有使用React，所以问题纯粹是关于Flux archiectural风格，我甚至没有使用JavaScript。

Answer 1

也许这是一个程度问题。我不认为对商店管理的财产进行简单检查就是商业逻辑。我认为这是非常简单的视图逻辑：

if (FooStore.IsButtonClickAllowed) {

该行似乎已经删除了关于为什么按钮可能无法点击的所有规则，并且它看起来像是在商店中管理的所有内容，这是合适的。

只有在保证允许的情况下才会发送通行证中的行动，即行动的有效性需要在发送之前进行检查。

我不同意这一点。有不同种类的验证。

有时可以在视图组件中进行非常简单的验证。在React中，组件可能采用较小程度的状态。输入组件是特别好的地方。例如，检查用户是否键入了类似于电子邮件地址的内容，可以在视图组件中完成。

然而，大多数验证需要针对应用程序状态或持久数据进行。在这些情况下，您需要发送操作，然后让商店使用业务逻辑对其进行响应。

行动应该像报纸一样，报道现实世界中发生的事情：用户做了某件事，从服务器回来的回复等等。行动不需要防止发生;他们报告实际发生的事情。商店完成其余的工作。

当用户执行违反验证规则的操作时，商店会通过向视图提供错误数据来对此做出响应。

Answer 2

我已经创建了一个新组件（ActionDispatcher）来处理验证：

class ActionDispatcher {
    void ButtonClick() {
        if (FooStore.IsButtonClickAllowed) {
            Dispatch(ButtonClickAction);
        }
    }
}

然后，视图（和其他操作源）始终使用ActionDispatcher，而不是直接调度操作：

class FooView {
    void OnButtonClick() {
        ActionDispatcher.ButtonClick();
    }
}

我刚刚将验证码整理到一个位置。

谁说在Flux中允许一个Action？

2 个答案: