Почему переменная состояния внутри редуктора redux не увеличивается на 1

Question

У меня есть две простые кнопки на веб-странице: одна для увеличения, а другая для уменьшения целого числа.

Как только я нажму кнопку +, он добавит 1 к текущему значению.

Ниже мой Reducer и я обернул "INCREMENT" с аsetTimeoutи когда я нажимаю кнопку +, я ожидаю увидеть 1 на странице через 2 секунды, но это дает мне 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

Answer 1

Поскольку функция редуктора работает, детерминированно возвращая новое значение состояния, учитывая старое состояние и любое действие.

В вашем коде вы просто переназначаете переменную состояния с помощью этой строки:

    state = state + 1

Если вы хотите обновить состояние через 1 секунду, я бы использовал setTimeout, чтобы отложить запуск действия "обновить состояние".