slice redux-toolkit中的状态异常行为已撤销的代理

问题描述

沙盒：https://codesandbox.io/s/ucjrx?file=/src/features/todos/todosSlice.js

在todoSlice.js的第14行，当我尝试执行console.log时，它被打印为已撤销的代理（浏览器控制台）。但是，当我在chrome开发工具中设置断点并逐步执行该操作时，它并不是被撤销的代理。 为什么会这样？

解决方法

在RTK缩减程序中，状态库由沉浸式库包装在Proxy对象中以检测修改。 reducer完成后，该代理对象将被吊销以防止内存泄漏。

不幸的是，console.log并没有记录对象的实时快照，而是记录了引用-而您尝试实际探索这些内容的时间已经被撤消了。

As the documentation explains，您应该使用current从RTK重新导出的沉浸器导出记录草稿状态值：

import { createSlice,current } from '@reduxjs/toolkit'

const slice = createSlice({
  name: 'todos',initialState: [{ id: 1,title: 'Example todo' }],reducers: {
    addTodo: (state,action) => {
      console.log('before',current(state))
      state.push(action.payload)
      console.log('after',current(state))
    },},})