Question

何时修改可接受的反应类组件中的状态变量，何时调用操作来更改状态变量？

最佳做法是什么？更改反应类组件中的状态变量是否会违反Flux惯例？

Answer 1

这个问题没有正确的答案，因为它是上下文的，并且在很大程度上取决于您的代码。但是，根据个人经验，我会敦促你不要使用状态变量。在没有子项的组件中可能是可以接受的，但是仍然很容易在组件中有很多逻辑，而这些逻辑并不严格依赖于表示（读取：呈现）。

我的观点：将您的状态和数据保存在商店中，让组件变得非常愚蠢，只处理渲染和执行操作。这种方法使应用程序更容易测试并确保可读性。

Answer 2

我会考虑在有问题的数据被本地化并紧密耦合到组件的情况下使用组件状态，这意味着它仅与组件本身相关并且不太可能需要将来，应用程序的任何其他部分。当然，你无法预料到一切，所以当有疑问时，最好将其视为“应用程序状态”并将其放入商店。

表单输入是可能适用的一种情况。例如，典型用户注册或登录表单的输入字段的瞬态状态不太可能与应用程序的其他部分相关。数据仅用于呈现组件本身以及进行提交数据的API调用，因此将表单的状态视为表单的一部分并使用组件状态来自然存储它。

反例是动态搜索的输入，用于过滤单独组件中的列表，其中列表应在用户开始键入后立即开始响应。这里输入的瞬态应该被视为应用程序状态，并保存在其他组件可以访问它的存储中。

Answer 3

您应该只使用操作来写入商店，因此如果您的状态直接表示商店中的内容，那么您应该只使用操作来更新它。有很多选项，但https://github.com/HubSpot/general-store附带了一个mixin，可以让你将商店数据直接绑定到状态。

因此，在您的组件中，您可以执行以下操作：

mixins: [
    GeneralStore.StoreDependencyMixin({
      user: UserStore.get()
    })
]

这会将该商店中的任何数据绑定到状态，当商店更新时，您的组件将处于状态。在许多情况下，组件具有一些本地状态，如：

getInitialState: ->
  modalOpen: false

openModal: ->
  @setState
    modalOpen: true

我遇到过一些情况，我想让商店中的数据不同步，以便我可以跟踪更改并可能进行重置并在用户保存之前列出对模型的更改以及我的方式这是通过jsut复制状态中的商店模型并直接变异，然后在保存时使用操作来命中保存端点，然后将新保存的模型传递到商店，这将更新本地（不同步）副本和商店本身的主要真相来源。