Reactjs react redux中的计时器：跟踪滴答声的操作，或只是启动/停止

我一直在研究react redux中计时器的实现。似乎有两个小学的思想流派

仅对停止/启动/重置使用操作 在这篇文章中解释（）

对秒表的每个滴答声也使用一个动作 我在这本书里读到过。似乎连丹·阿布拉莫夫都对这件事发表了评论。那么也许可以证明这种方法

---

---

这方面有最佳实践吗？还是视情况而定？我正在为我的应用程序制作一个计时器，用于跟踪特定任务的时间长度，我只想第一次以正确的方式实现它。我最初的想法倾向于选项1。

在很多情况下，“勾选”的想法根本不起作用：

• 如果在页面关闭时计时器需要保持运行，或
• 如果用户使用的设备速度较慢，或者他们的计算机冻结，计时器可能会随着滴答声事件的延迟或跳过而“漂移”

对于您的Redux状态，更好的解决方案可能是：

tasks: [
    { id: '6d5d9f59-a65c-44ad-bf76-b69ef89b4f58',
      title: 'Task One',
      startTime: 1482160636032 },
    { id: '25a502e9-f2ef-4f65-bba6-723cc755c708',
      title: 'Task One',
      startTime: 1482160697663 }
]

使用此函数，您只需减去

Date.now（）-task.startTime

即可获得经过的时间

然后，对于计时器，我将每秒重新计算React组件：

class Task extends Component {
    componentDidMount () { tick () }
    componentWillUnmount () { clearTimeout (timer) }
    tick () {
        // time until next second
        // won't drift with time
        const nextSecond = 1000 - Date.now () % 1000
        this.timer = setTimeout (tick, nextSecond)

        this.setState ({ elapsedTime: Date.now () - this.props.task.startTime })
    }
    render () { ...  }
}