0

我在网页上有一个简单的两个按钮，一个用于递增，一个用于递减整数。 在此处输入图像描述

一旦我点击+按钮，它将在当前值上加 1。

下面是我的减速器，我已经用 a 包裹了“INCREMENT”setTimeout，当我点击+按钮时，我希望在 2 秒后在页面上看到1，但是一旦点击发生，它就会给我77，而无需等待 2 秒，为什么会发生这种情况，为什么每次都是 77？

ps 我可能需要一个中间件来处理这个异步操作，但我试图了解发生了什么

谢谢

const mathReducer = (state = 0, action) => {
  switch (action.type) {
    case 'INCREMENT':
      return setTimeout(() => {
        state = state + 1
      }, 2000)
    case 'DECREMENT':
      return state - 1
    default:
      return state
  }
}

export default mathReducer
4

1 回答 1

2

因为 reducer 函数通过确定性地返回状态的新值、给定旧状态以及任何操作来工作。

在您的代码中，您只需使用以下行重新分配状态变量：

    state = state + 1

如果您要做的是在 1 秒后更新状态，我会使用 setTimeout 来推迟触发“更新状态”操作。

于 2020-02-17T05:56:19.890 回答