我试图围绕Facebook的Flux ......
假设我有一个带侧边菜单的应用程序，可以通过标题中的按钮隐藏和显示。
我的标题是一个组件，我的侧边菜单是另一个组件。
目前我的Header组件只是在HTML div侧面菜单元素上设置一个类，该元素被CSS动画隐藏。
这里的一般想法是什么？
答案 0 :(得分：2)
ReactJs并不真正关心它如何获取数据（如何传入数据或如何在Web应用程序中处理数据）。这就是Flux的用武之地，它为数据的处理方式创建了一种功能性方法。数据流本质上是：
Action -> Data Store -> Component
通过调用Actions发生数据突变。数据存储本身必须监听操作并改变存储中的数据。这使数据结构和逻辑保持平稳。
在您的情况下，您的数据流可能如下所示：
标题 - ＆gt;用户点击 - ＆gt;火灾行动 - ＆gt;更新商店 - ＆gt;侧边菜单监听并响应该商店的变化。
您的案例是一个简单的例子，您可能并不真正需要Flux。我认为如果你有一个维护视图状态逻辑的父组件，并且为2个子组件（侧面菜单和标题）使用props / callbacks会更容易。但是一个更高级的例子，你需要进行ajax调用和维护会话，Flux会变得有用。就像你有一个登录组件，并且你想根据用户显示不同的侧面菜单选项和标题选项：
Login Component --> User Logins --> Calls Action #signIn --> Showing Loading State
--> Dispatcher handles action (make api call to authenticate user and load user data)
On success (for the api call), alert sessionStore, and populate store with data
On error, maybe fire another action that says login failed or something
SessionStore ---> Header Component (Listens to Store) --> Update view based on store information
---> Side Menu Component (Listens to Store) --> Update
答案 1 :(得分：0)
说得更一般：
flux是单向数据流的软件架构。它的链是行动 - ＆gt;授权 - ＆gt;商店 - ＆gt;查看...操作 - 例如按钮单击 - 被委派给存储应用程序逻辑和数据的商店...此处您的操作和数据将被更改和处理。商店最终会发出一个事件，该事件通过回调查看先前注册的（例如反应组件）。在此回调中，您可以从商店获取数据。值得一提的是，您只能访问READ-Only商店。
因此，对于您的情况......如果您希望组件A影响组件B，则必须将组件B注册到商店eventEmitter并从商店获取所需的数据。一旦组件触发了一个动作，它就会被委托给商店，你的函数会被执行，最终抛出的事件会启动组件B的回调。
希望这一点足够清楚...它的方式更酷，有一些漂亮的图纸。