React Alt 同步调用 store 方法答案

【问题标题】：React Alt Calling a store method synchronouslyReact Alt 同步调用 store 方法
【发布时间】：2016-03-03 09:00:24
【问题描述】：

开发一个 React/Alt 应用程序，我面临一个很常见的场景：
在根组件中，在按钮单击处理程序中，我需要在触发操作之前检查特定商店中的值是否有效。该值在商店的状态中尚不可用，因为它必须进行计算。
所以我必须调用一个与 store 的方法相关联的动作来计算值。结果将存储在 store 的状态中，并将在根组件的 listener-handler 中可用。
不幸的是，在这种情况下，我丢失了用户操作的初始上下文。
我想同步计算该值并在同一上下文中检索它。有没有办法做到这一点？在这种情况下，最佳做法是什么？
谢谢。

【问题讨论】：

所以我认为该状态的实际值不取决于按钮本身？例如，按钮不会更改值，例如文本输入。我所做的是我保持按钮状态禁用，直到值正确，或者我确保按下按钮时，状态已经被计算。这可以通过使用示例文本输入，将该输入的更改推送到存储并计算它来简单地完成。这样你总是有正确的状态。您能否详细说明为什么该值在商店状态下不可用？
更准确的例子是处理所有表单值的表单存储。
好的，按钮上的操作将如何处理陈旧的商店？
对不起，我写评论时出错了：更相关的例子是处理表单所有值的表单存储。当用户单击按钮时，无论按钮是什么，我都需要检查表单是否有效（遍历值并验证它们）。为了使状态始终保持最新，我应该在用户每次与输入交互时验证表单。这个解决方案非常注重性能。我只需要验证一次表单。
嗯明白了。我通常会在每次更新时验证表单，但显然这会带来性能下降。您可以做的不是在商店中而是在单独的模块中进行验证，并在按下按钮时进行验证。因此，您可以使用您的道具或 store.getState() 并将其提供给库。那行得通吗？我在一个地方使用它。将其分离到一个模块中使其可测试+可重用，并从您的反应组件中删除逻辑。

标签： javascript reactjs alt

【解决方案1】：

您可以将验证逻辑拆分为单独的模块。在onClick 处理程序上，您可以使用store.getState() 或组件的道具执行此验证逻辑。然后验证逻辑将与您的组件分开，这使得测试和重用变得容易，而且它不会使您的组件混乱，它应该更关心接口的行为。

【讨论】：