在调度中检测到状态突变：即使使用工具包

Question

此操作引发以下错误：

    setTimerState(state, { payload }: PayloadAction<{ timer: StepTimer, timerState: CookingTimerState }>) {
      const { timer, timerState } = payload
      const timerInStore = state.stepTimers
        .find(t => t.timerId === timer.timerId)!
      timerInStore.state = timerState
    }

Error: Invariant failed: A state mutation was detected inside a dispatch, in the path: cookingSession.stepTimers.0.state. Take a look at the reducer(s) handling the action {"type":"session/setTimerState","payload":{"timer":{"label":"Dance","durationSec":600,"stepIndex":0,"timerId":0,"state":2},"timerState":2}}

我认为 Redux 工具包允许您进行这种状态更改。是因为我的 StepTimer 是 class 对象而不是 POJO 吗？

Answer 1

正确。只有原始值、对象和数组被认为是可序列化的，class 个实例不是。

根据 Redux 风格指南，you shouldn't be putting class instances in your state。

在调度中检测到状态突变：即使使用工具包

A state mutation was detected inside a dispatch: Even with toolkit

reactjs

redux

redux-toolkit