我是React的新手，我仍然不知所措。我个人的Hello World项目是一个时间跟踪/计费应用程序，基本上是一个美化的秒表，而且我被卡住了。
基本上，<TaskList />组件中有多个<Task />个孩子。启动任务会创建存储在任务组件state中的间隔，用于更新已用时间显示。可以启动，停止和恢复任务，但一次不应运行两个任务。启动/恢复任务应该停止当前正在运行的任何其他任务。
我的问题是如何在启动新任务时指示正在运行的任务停止？
在我的每个任务组件的componentDidMount方法中，他们会监听由其他任务触发的START事件，并启动并运行自己的stop()函数（如果有）但我似乎发现自己错误：Uncaught Error: Invariant Violation: Dispatch.dispatch(...): Cannot dispatch in the middle of a dispatch.。
我会粘贴我的代码，但我的直觉说我已经完全错了，我的代码并不重要。
我应该在我的商店内停止其他任务，而不是在我的组件中吗？这是有道理的，但我如何清除每个任务附加的间隔？
（我希望橡皮鸭可以帮助我，但它没有帮助我。
答案 0 :(得分：0)
没有设置一个全局事件系统来根据另一个计时器正在做什么来停止和启动每个计时器，因为它们不共享相同的状态，而不是你想要查看本文档。
https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers
然而，这种方式很糟糕，我建议让父组件生成子组件的状态来管理孩子们如何开始和停止。子组件将有一个onClick = {this.props.parentClickEvent}，它应该告诉父级启动和停止计时器等...如果需要知道哪个元素被特别点击，你将需要查看绑定函数能够将它的（this）值传递给父元素。
答案 1 :(得分：0)
Flux的方式是将所有任务保存在商店中。我该怎么做：
每个任务都有一个状态：'running'或'idle'和elapsedTime，以秒为单位。每当您从视图中启动任务时，都会调用ActionCreator。此操作创建者使用任务ID作为有效负载调度“TASK_STARTED”。商店的调度处理程序侦听此操作，并处理现在应该正在运行或空闲的任务。然后商店发出更改事件，视图会自行更新。
间隔可以存在于任务视图中（更好的是，子视图：TaskClockView），每秒创建一个Action“TASK_TIME_ELAPSED”，具有新的任务时间。商店将更新自己，然后更新视图。