Why state redux-toolkit is proxy?

user_18191256 0
Viewed 38

I need to change the values in a string that I have created. But I can't edit because TypeScript says I'm trying to put in state - void [Screenshot]
enter image description here

After creating strings and substrings, they are all displayed in ReduxDevTools

[Screenshot]
enter image description here

But if you output state.levels to the console, it shows the prototype or something wrong ... not what you need to work
[Screenshot]
enter image description here

redux-toolkit reactjs
1 Answers

Because Redux Toolkit's createReducer API uses immerjs internally automatically, the state in the reducer is a draft state, which is a proxy of the current state. See Debugging and Inspecting Drafted State

RTK re-exports current. You can use this in your reducers if you need to log or inspect the work-in-progress state.

import { current } from '@reduxjs/toolkit'

const todosSlice = createSlice({
  name: 'todos',
  initialState: todosAdapter.getInitialState(),
  reducers: {
    todoToggled(state, action) {
      // ❌ ERROR: logs the Proxy-wrapped data
      console.log(state)
      // ✅ CORRECT: logs a plain JS copy of the current data
      console.log(current(state))
    },
  },
})
user_64635580
Related